Mini apps

Vibe Work peut créer des mini apps interactives : des applications React autonomes qui s’exécutent directement dans le panneau Canvas. Décrivez ce que vous voulez et Work génère le code et affiche l’application en direct.

Décrivez l'application que vous souhaitez en langage naturel. Work génère le code et l'affiche immédiatement.

Exemples de prompts :

• « Construire un convertisseur d’unités pour la longueur, le poids et la température. »
• « Créer un minuteur Pomodoro avec des commandes de démarrage, de pause et de réinitialisation. »
• « Créer une application de quiz avec cinq questions sur les capitales du monde. »
• « Construire un générateur de palettes de couleurs qui me permet d’ajuster la teinte et la saturation. »

L’application apparaît directement dans la conversation sous forme de panneau d’aperçu et devient immédiatement interactive. Cliquez sur les boutons, remplissez les formulaires et utilisez-la comme vous le feriez normalement. Cliquez sur Agrandir en bas du panneau pour l’ouvrir dans la vue Canvas.

Le panneau Canvas propose deux vues, accessibles via les icônes en haut à gauche :

• Aperçu (icône en forme d’œil) : affiche l’application en cours d’exécution. C’est la vue par défaut.
• Code (icône <>) : affiche les fichiers source. Une liste de fichiers apparaît à gauche ; cliquez sur un fichier pour l’ouvrir dans l’éditeur.

Améliorez l’application en continuant la conversation :

• « Ajouter un interrupteur pour le mode sombre. »
• « Modifier les couleurs des boutons pour correspondre à notre marque. »
• « Ajouter un bouton de réinitialisation qui supprime tous les champs. »

Work met à jour le code et réaffiche l'application. Vous pouvez également modifier les fichiers sources directement dans la vue Code.

Pour télécharger l’application sous forme d’archive ZIP :

Cliquez sur l'icône de téléchargement dans le coin supérieur droit du panneau Canvas.

Le fichier ZIP contient tous les fichiers sources (index.js, styles.css et tout autre fichier créé par Work) et peut être ouvert dans n’importe quel éditeur de code ou déployé sur un hôte statique.

Pour partager une version interactive et en direct de l’application :

1. Cliquez sur Partager dans le coin supérieur droit du panneau Canvas.
2. Activez l'interrupteur Lien accessible à tous.
3. Cliquez sur Copier le lien pour copier l'URL publique, ou utilisez l'un des boutons Partager vers pour l'envoyer directement par e-mail, X, LinkedIn, Reddit ou WhatsApp.

Toute personne disposant du lien peut consulter l’application et interagir avec elle. Vos messages de conversation ne sont pas partagés. Seule l’application elle-même est accessible via le lien.

Pour arrêter le partage, retournez à la fenêtre Partager et désactivez l'interrupteur Lien accessible à tous.