L'aperçu
L’onglet Aperçu montre ton app en direct, telle que tes visiteurs la verront. Elle tourne dans un environnement isolé propre à ton projet, et se met à jour à chaque fichier que l’agent écrit : tu vois l’app grandir section par section pendant qu’il travaille. Tu peux cliquer, remplir les formulaires et naviguer entre les pages comme sur le vrai site.
La barre de l’aperçu
Section intitulée « La barre de l’aperçu »Au-dessus de l’app, de gauche à droite :
| Élément | À quoi il sert |
|---|---|
| Ordinateur · Tablette · Mobile | Change la taille de l’écran. Ordinateur prend toute la largeur ; Tablette affiche l’app dans un cadre de 768 × 1024 px (une tablette en portrait) ; Mobile dans un cadre de 390 × 844 px (un téléphone). Si la place manque, le cadre est réduit à l’échelle : l’app garde sa vraie largeur. |
| Barre d’adresse | Affiche la page en cours (/, /tarifs…). Clique dedans, tape un chemin et appuie sur Entrée pour ouvrir cette page ; Échap annule. Le point à gauche est vert quand l’aperçu est prêt. |
| Recharger | Recharge la page affichée. |
| Logs du serveur | Ouvre le panneau des logs en bas de l’aperçu (voir plus bas). |
| Ouvrir dans un onglet | Ouvre la page affichée dans un nouvel onglet de ton navigateur, en plein écran. |
La première génération : l’écran de construction
Section intitulée « La première génération : l’écran de construction »Quand l’agent construit une nouvelle app, l’aperçu affiche un écran Highwind construit ton app : « L’aperçu s’affiche dès que la page est prête. » Il liste les derniers fichiers écrits et ce que fait l’agent (« Analyse du projet… », « Écriture du code… », « Réflexion… »). Dès que la première page de l’app existe, l’écran s’efface en fondu et tu vois l’app se compléter en direct.
Quand l’app rencontre une erreur
Section intitulée « Quand l’app rencontre une erreur »Si l’app plante ou affiche une page blanche, un bandeau apparaît en bas de l’aperçu : L’app a rencontré une erreur (ou N erreurs), avec le type d’erreur et son message.
- Clique sur Détails pour voir toutes les erreurs (type, message et fichier concerné).
- Clique sur Corriger : Highwind envoie à l’agent un message avec les erreurs (« L’aperçu affiche une erreur. Corrige-la : … »), en mode Construction. L’agent les analyse et corrige le code.
- Ou clique sur Ignorer (la croix) pour masquer le bandeau, si l’erreur ne te gêne pas pour l’instant.
Les types d’erreurs signalés sont : Exception (le code a planté), Promesse rejetée (une opération asynchrone a échoué), console.error (le code a écrit une erreur dans la console), Compilation (le code ne se compile pas) et Page blanche (rien ne s’affiche).
Bon à savoir :
- Pendant que l’agent travaille, le bandeau est masqué : l’agent voit lui-même les erreurs de l’aperçu et les corrige avant de finir.
- Sur une ancienne version, il n’y a pas de bouton Corriger (une ancienne version ne se modifie pas).
- Corriger est une demande à l’agent comme une autre : elle consomme des crédits et crée une nouvelle version.
Les logs du serveur
Section intitulée « Les logs du serveur »Si ton app a un serveur (des routes /api, pour envoyer des e-mails, appeler un service avec une clé…), ses logs t’aident à comprendre ce qui se passe. Clique sur Logs du serveur dans la barre de l’aperçu : un panneau s’ouvre en bas, avec deux onglets.
- Aperçu : les logs du serveur de développement de l’aperçu. Tu y vois les
console.loget les erreurs des routes/apide ton app, ainsi que les messages de Vite. Les lignes d’erreur sont en rouge. Le panneau se met à jour toutes les deux secondes et reste collé en bas, sauf si tu remontes pour lire. - En ligne : les logs de ton app publiée, sur les 24 dernières heures, avec quelques secondes de retard. Chaque appel à
/apis’affiche avec son heure, son résultat (code de statut) et sa durée, ainsi que lesconsole.loget les erreurs.
Messages que tu peux y voir :
| Message | Signification |
|---|---|
| « Rien pour l’instant… » | Le serveur n’a encore rien écrit. Utilise la fonction concernée dans l’aperçu pour générer des logs. |
| « L’aperçu est en veille : les logs reprendront à son réveil. » | L’environnement de l’aperçu s’est endormi (voir plus bas). |
| « Cette app n’est pas encore publiée… » | Onglet En ligne : publie l’app pour avoir des logs en ligne. |
| « L’app publiée n’a pas de serveur (site statique)… » | Onglet En ligne : ton app n’a pas de routes /api, il n’y a donc pas de logs. |
Le bouton Logs du serveur n’apparaît que sur la version actuelle, pas quand tu consultes une ancienne version.
Mise en veille et réveil
Section intitulée « Mise en veille et réveil »Pour ne pas faire tourner des environnements inutilement, l’aperçu se met en veille après un moment sans activité. Tes fichiers sont conservés.
- Tant que l’onglet de l’éditeur est ouvert et visible, Highwind signale régulièrement ton activité : l’aperçu reste éveillé.
- Quand tu reviens sur l’onglet (ou rouvres le projet), l’aperçu se réveille tout seul : « Démarrage de l’aperçu… » s’affiche quelques secondes, puis l’app revient.
- Si le démarrage échoue, un message d’erreur s’affiche avec un bouton Réessayer.
L’aperçu d’une ancienne version
Section intitulée « L’aperçu d’une ancienne version »Quand tu consultes une ancienne version depuis l’historique, l’aperçu affiche « Préparation de la version N… » le temps de démarrer un environnement temporaire avec le code de cette version. Tu peux naviguer dans l’app, mais pas la modifier, ni sélectionner d’élément. Voir Versions et historique.