Installation

Xano

Suivez ces étapes pour installer le HackSystem dans votre compte Xano :

1. Générer votre token

• Connectez-vous à votre dashboard HackSystem

• Générez votre token personnel

[Emplacement pour la capture d'écran 1]

2. Accéder à la page du HackSystem sur Xano

• Rendez-vous sur la page du HackSystem sur la plateforme Xano en cliquant sur le lien de votre dashboard.

3. Ajouter à votre compte Xano

• Cliquez sur le bouton "Add to your Xano Account"

4. Se connecter et coller le token

• Connectez-vous à votre compte Xano si ce n'est pas déjà fait

• Sélectionnez l'instance dans laquelle vous souhaitez ajouter le boilerplate

  
• Collez votre token HackSystem dans le champ approprié

Note : Le processus peut prendre un peu de temps. Veuillez patienter.

5. Accéder à la Marketplace

• Rendez-vous dans votre instance xano

• Cliquez sur la rubrique "Marketplace"

• Cliquez ensuite sur l'onglet "Purchased"

6. Installer le HackSystem

• Trouvez le HackSystem dans vos achats

• Cliquez dessus pour ouvrir les détails

7. Installer le Snippet

• Cliquez sur le bouton "Install Snippet" pour terminer l'installation

Félicitations ! Vous avez maintenant installé le HackSystem dans votre compte Xano.

Resend

Suivez ces étapes pour configurer Resend avec votre compte Xano :

1. Accéder à Resend

• Rendez-vous sur Resend

2. Créer un compte gratuit

• Suivez les étapes pour créer un compte gratuit sur Resend

3. Accéder aux API Keys

• Une fois le compte créé, allez dans la section "API Keys"

4. Créer une clé API

• Cliquez sur le bouton pour créer une nouvelle clé API

• Paramètres à utiliser :

  • Permission : Full Access

  • Domains : All Domains

5. Copier la clé API

• Copiez la clé API générée

6. Retourner sur Xano

• Revenez sur votre instance Xano

7. Accéder aux réglages

• Dans votre compte Xano, allez dans les réglages

8. Configurer la variable d'environnement

• Dans la section "Environment Variables", cliquez sur "Manage"

• Trouvez la variable "resend_api_key"

• Collez votre clé API Resend comme valeur de cette variable

9. Enregistrer les modifications

• N'oubliez pas d'enregistrer vos modifications

Webflow

Installation et configuration de Webflow

Suivez ces étapes pour configurer votre projet Webflow avec le boilerplate :

1. Créer un compte Webflow (si nécessaire)

• Si vous n'avez pas encore de compte Webflow, créez-en un en cliquant ici.

N.B.: Pour pouvoir utiliser le boilerplate, il est nécessaire d'avoir un plan workspace ou un hébergement actif sur le site du boilerplate (Webflow n'autorise pas l'ajout de custom code sinon)

2. Cloner le projet boilerplate

• Rendez-vous sur la page du clonable boilerplate

• Cliquez sur le bouton pour cloner le projet dans votre compte Webflow

3. Personnaliser les variables

• Une fois le projet cloné, accédez aux paramètres du projet

• Customisez les variables selon vos besoins et préférences

Linkedin Auth

1. Accéder à LinkedIn Developer

• Rendez-vous sur la page LinkedIn Developer

2. Créer une nouvelle application

• Cliquez sur le bouton "Create App"

• Identifiez-vous avec votre compte LinkedIn si ce n'est pas déjà fait

3. Remplir les informations de l'application

• Complétez tous les champs concernant votre application (N.B.: tous les chamlps sont obligatoires)

4. Demander l'accès au service d'authentification

• Dans la liste des produits disponibles, trouvez "Sign In with LinkedIn using OpenID Connect"

• Cliquez sur "Request Access" pour ce produit

5. Accéder aux clés API

• Allez dans la rubrique "Auth" de votre application LinkedIn

• Copiez les clés API (publique et secrète)

6. Configurer les variables d'environnement

• Rendez-vous dans la section "Settings" > "Environment Variables" de votre plateforme

• Collez les clés API dans les variables correspondantes

7. Configurer les URLs de redirection

• Dans la section "Authorized redirect URLs for your app" sur LinkedIn Developer

• Ajoutez les URLs suivantes :

  • URL de staging Webflow avec le slug /oauth/linkedin

  • URL de votre domaine avec le même slug /oauth/linkedin

8. Configurer les URLs de l'application

• Allez dans la rubrique "Settings" de votre application LinkedIn

• Renseignez 🎉

  • L'URL de votre staging Webflow

  • L'URL de votre domaine (root)

Wized

Suivez ces étapes pour configurer Wized avec votre boilerplate et votre compte Xano :

1. Créer un compte Wized (si nécessaire)

• Si vous n'avez pas encore de compte Wized, créez-en un sur Wized

[Emplacement pour la capture d'écran 1]

2. Dupliquer le boilerplate

• Cliquez sur le lien de votre dashboard HackSystem pour dupliquer la base du boilerplate

[Emplacement pour la capture d'écran 2]

3. Configurer Wized

• Suivez l'étape de configuration :

  • Collez votre code dans Webflow

  • Publiez votre site Webflow

  • Mettez l'URL de staging dans Wized

[Emplacement pour la capture d'écran 3]

4. Accéder à l'API Xano

• Allez dans votre compte Xano

• Naviguez vers la rubrique API

[Emplacement pour la capture d'écran 4]

5. Copier l'endpoint d'authentification

• Dans la section API de Xano, copiez l'endpoint de l'API "auth"

[Emplacement pour la capture d'écran 5]

6. Configurer l'endpoint d'authentification dans Wized

• Retournez dans Wized

• Trouvez l'app Xano - Auth

• Remplacez la valeur de l'endpoint par celui que vous venez de copier

[Emplacement pour la capture d'écran 6]

7. Répéter pour tous les endpoints

• Répétez les étapes 5 et 6 pour tous les autres endpoints de votre API Xano

[Emplacement pour la capture d'écran 7]

Félicitations ! Vous avez maintenant configuré Wized avec votre boilerplate et votre compte Xano.