Cet article vous permet de comprendre comment développer une tuile personnalisée dans l'app de vos clients. Cela vous permet d'étendre les possibilités de notre logiciel à l'infini.
Lorsque l'utilisateur appuie sur votre tuile dans l'application mobile Hexfit, nous ouvrons une WebView vers l'URL que vous nous avez précédemment fournie.
Si vous le souhaitez, avant l'ouverture, l'application peut automatiquement injecter des informations sur l'utilisateur connecté directement dans l'URL sous forme de variables.
Variables disponibles
Variable | Contenu |
{{FIRSTNAME}} | Prénom de l'utilisateur |
{{LASTNAME}} | Nom de l'utilisateur |
{{EMAIL}} | Adresse e-mail de l'utilisateur |
{{APIKEY}} | Clé API Hexfit de l'utilisateur |
Vous pouvez placer ces variables n'importe où dans l'URL que vous nous fournissez. Par exemple :
https://votre-app.exemple.com/entree?apikey={{APIKEY}}&email={{EMAIL}}
Quand un utilisateur appuie sur la tuile, l'application remplace les variables et ouvre l'URL réelle :
https://votre-app.exemple.com/entree?apikey=abc123&email=jane@exemple.com
Cela vous permet de personnaliser le contenu de la tuile au contexte de l'utilisateur.
Identifier l'utilisateur côté serveur
Une fois que votre page reçoit la clé `{{APIKEY}}`, vous pouvez appeler l'API Hexfit pour récupérer le profil complet de l'utilisateur :
GET https://v2.hexfit.io/User/GetInfo?user_id=-
Authorization: Bearer <APIKEY>
Le `user_id=-` est un raccourci qui retourne les informations du propriétaire de la clé, c'est-à-dire l'utilisateur actuellement connecté.
Documentation : https://apidoc.myhexfit.com/v2/#api-User-GetInfo
**Note de sécurité :** La clé API est personnelle. Utilisez toujours HTTPS et ne la stockez pas en clair.
APIKEY pour le développement
Pour le développement, nous vous conseillons de vous connecter sur le logiciel avec un compte client qui vous appartient. Interceptez l'APIKEY dans le header et utilisez-la pour faire vos tests.
L'APIKEY expirera, donc n'hésitez pas à refaire la manipulation pour avoir une nouvelle clé.
La documentation de notre api est ici : https://apidoc.myhexfit.com/
Vibe Coding (Lovable, Base44, Bolt, etc.)
Voici un prompt de base à copier-coller dans un site de vibe coding pour développer votre tuile personnalisée. Assurez-vous d'ajouter à la fin les fonctionnalités que vous souhaitez.
Je développe une tuile personnalisée pour l'application mobile Hexfit.
Hexfit est une plateforme utilisée par des professionnels de la santé et de l'entraînement (kinésiologues, entraîneurs, physiothérapeutes) pour suivre leurs clients.
Une tuile personnalisée est une petite application web qui s'affiche dans l'interface client de l'application mobile Hexfit. Elle est chargée via une URL externe dans une webview mobile.
Lors du chargement, Hexfit fournit dans l’URL :
- apikey
- parfois d'autres paramètres contextuels
La tuile doit :
- lire les paramètres présents dans l’URL
- utiliser apikey pour appeler l’API Hexfit (User/GetInfo?user_id=- pour savoir à qui appartient l'APIKEY)
- récupérer les données du client
- afficher ces données dans une interface simple et utile
- Ne pas mettre en cache le contenu de la page puisque l'APIKEY change à chaque ouverture
Contraintes :
- fonctionner dans une webview mobile
- être mobile-first et responsive
- être sécurisée
- afficher une interface claire et simple
Documentation Hexfit :
- API documentation : https://apidoc.myhexfit.com/
- Guide des tuiles personnalisées : https://help.myhexfit.com/fr/articles/13921809-tuiles-personnalisees-guide-developpeur-externe
Fonctionnalités de la webview :
Quoique le vibe coding est souvent très facile, avoir une personne technique pourra fortement vous aider.
Mettre en production
Une fois que votre site prêt, simplement nous fournir le lien et nous pourrons le mettre en place sur votre app.