Canvas pour le code
Un environnement de développement dans Le Chat
Canvas ne se limite pas à la rédaction de texte. Il offre également un mode dédié au code qui transforme Le Chat en un environnement de développement léger. Vous pouvez écrire, modifier, débugger et même exécuter du code directement dans l’interface.
Cette fonctionnalité est particulièrement utile pour le prototypage rapide, la résolution de bugs, l’apprentissage de la programmation et la création de scripts utilitaires.
Ouvrir Canvas en mode code
Pour activer le mode code de Canvas, précisez votre intention dans votre requête :
- « Ouvre Canvas et écris un script Python pour analyser un fichier CSV »
- « Crée un composant React dans Canvas »
- « Code une fonction JavaScript qui trie un tableau d’objets par date »
Le Chat détecte automatiquement le langage et applique la coloration syntaxique appropriée.
Langages supportés
Canvas prend en charge la plupart des langages de programmation courants :
- Python : scripts, analyse de données, automatisation
- JavaScript / TypeScript : développement web, Node.js
- HTML / CSS : interfaces web, mises en page
- SQL : requêtes de base de données
- Bash : scripts système et automatisation
- Et bien d’autres : Go, Rust, Java, C++, PHP, Ruby
Écrire du code avec Canvas
Génération initiale
Décrivez ce que vous souhaitez réaliser en langage naturel :
« Écris un script Python qui se connecte à une API REST, récupère les données au format JSON, filtre les résultats par date et exporte le tout en CSV. Ajoute la gestion des erreurs et des commentaires explicatifs. »
Le Chat génère le code dans Canvas avec une structure propre et des commentaires.
Modification ciblée
Sélectionnez une portion de code et demandez une modification spécifique :
- « Ajoute une gestion des timeout pour cette requête HTTP »
- « Refactorise cette fonction pour la rendre plus lisible »
- « Remplace cette boucle for par une compréhension de liste »
- « Ajoute du logging à cette section »
Complétion et extension
Demandez à l’IA d’ajouter des fonctionnalités à votre code existant :
- « Ajoute des tests unitaires pour cette fonction »
- « Crée une interface en ligne de commande pour ce script »
- « Ajoute la pagination pour gérer les grands volumes de données »
Débugger avec Canvas
Identifier les erreurs
Collez votre code problématique dans Canvas et décrivez le comportement observé :
« Ce script Python lève une erreur IndexError à la ligne 42 quand la liste est vide. Corrige le bug et ajoute une vérification préalable. »
Le Chat identifie le problème, explique la cause dans le panneau de conversation et corrige le code dans Canvas.
Optimiser les performances
Sélectionnez une section de code que vous jugez lente et demandez :
« Cette fonction prend trop de temps avec de grands volumes de données. Optimise-la en gardant la même interface. »
Le Chat propose des optimisations (algorithmes plus efficaces, mise en cache, traitement parallèle) directement dans Canvas.
Exécution de code
Le Chat offre la possibilité d’exécuter certains types de code directement dans l’interface grâce à l’interpréteur intégré. C’est particulièrement utile pour :
- Tester un script Python rapidement
- Vérifier le résultat d’un calcul
- Valider le comportement d’une fonction
- Visualiser des données avec des graphiques
Pour exécuter du code, le Chat dispose d’un interpréteur Python et JavaScript. Les résultats s’affichent directement dans l’interface.
Export et intégration
Copier le code
Le bouton de copie permet de récupérer l’intégralité du code pour le coller dans votre IDE habituel (VS Code, PyCharm, IntelliJ, etc.).
Télécharger le fichier
Pour les scripts plus longs, vous pouvez télécharger le fichier directement depuis Canvas avec le nom et l’extension appropriés.
Intégration dans un projet existant
Canvas est idéal pour prototyper une fonction ou un module avant de l’intégrer dans votre projet. Le flux de travail recommandé est :
- Prototypez dans Canvas
- Testez avec l’interpréteur intégré
- Demandez à l’IA d’ajouter les imports et la documentation
- Exportez vers votre projet
Cas d’usage concrets
Automatisation quotidienne
« Écris un script Python qui renomme tous les fichiers PDF d’un dossier en ajoutant la date du jour au début du nom. »
Analyse de données
« Crée un script Python avec pandas qui charge un fichier Excel, calcule la moyenne et la médiane par catégorie, et génère un graphique à barres. »
Prototypage d’API
« Écris un serveur API minimal avec FastAPI qui expose un endpoint POST pour recevoir des données JSON et les stocker dans une liste. »
Utilitaires web
« Crée une page HTML avec un formulaire de calcul de TVA qui fonctionne entièrement côté client en JavaScript. »
Points clés à retenir
- Canvas mode code offre un environnement de développement léger intégré à Le Chat
- La coloration syntaxique et l’exécution de code sont disponibles pour les langages courants
- Utilisez la sélection ciblée pour modifier ou débugger des portions spécifiques de code
- Canvas est idéal pour le prototypage rapide, le debugging et l’apprentissage
- Exportez vos prototypes vers votre IDE une fois validés dans Canvas