Éditeur de code
Explorez, modifiez et personnalisez le code source de vos applications avec l'éditeur intégré
Mis à jour le 28 mars 2026
Vue d'ensemble
L'éditeur de code d'Index10 est intégré directement dans l'espace de travail. Il vous permet de consulter et modifier le code source de votre application, même si vous n'avez jamais programmé — l'IA peut se charger de l'essentiel.
L'interface de l'éditeur est divisée en deux panneaux principaux :
Panneau gauche — Chat IA
Conversez avec l'IA pour générer du code, ajouter des fonctionnalités ou corriger des bugs. L'IA modifie directement les fichiers.
Panneau droit — Code & Preview
Naviguez dans les fichiers, éditez le code source et visualisez l'aperçu en direct de votre application.
Arborescence des fichiers
L'explorateur de fichiers est accessible via l'onglet Code du panneau droit. Il organise les fichiers de votre projet en deux groupes :
Code source
Contient les pages, composants, styles et logique de votre application (src/pages/, src/components/, src/lib/)
Assets
Contient les images, icônes et fichiers statiques de votre application. Les nouveaux uploads apparaissent ici automatiquement.
Les fichiers de configuration (vite.config.ts, package.json, etc.) sont gérés automatiquement par la plateforme et ne sont pas modifiables directement.
Édition du code
Cliquez sur un fichier dans l'arborescence pour l'ouvrir. L'éditeur propose :
- •Coloration syntaxique — le code est coloré selon le langage (TypeScript, CSS, JSON, etc.)
- •Numéros de ligne — repérez-vous facilement dans le fichier
- •Modification directe — tapez du code directement, il est sauvegardé en temps réel
- •Indicateur de modification — un point apparaît sur l'onglet si le fichier contient des changements non publiés
Conseil :même si vous ne codez pas, l'éditeur est utile pour comprendre ce que l'IA a généré. Vous pouvez repérer les textes, couleurs ou valeurs à ajuster et les modifier directement.
Raccourcis clavier
| Raccourci | Action |
|---|---|
Tab | Indenter la sélection |
Shift + Tab | Désindenter la sélection |
Ctrl / ⌘ + Z | Annuler la dernière modification |
Ctrl / ⌘ + Shift + Z | Rétablir la dernière modification |
Ctrl / ⌘ + S | Sauvegarder le fichier |
Ctrl / ⌘ + F | Rechercher dans le fichier actif |
Recherche dans le code
La recherche globalepermet de trouver un texte dans tous les fichiers de votre projet. Elle est accessible via l'icône loupe dans la barre d'outils.
- •Recherche insensible à la casse par défaut
- •Cliquez sur un résultat pour ouvrir le fichier à la bonne ligne
- •Les résultats affichent un extrait du code avec le terme surligné
Fichiers gelés
La fonctionnalité Geler un fichier(❄️) empêche l'IA de modifier un fichier que vous souhaitez conserver tel quel.
Comment geler un fichier :
Quand geler un fichier ?Lorsqu'il contient des personnalisations manuelles que vous ne voulez pas que l'IA réécrive (styles sur mesure, intégrations spécifiques, texte validé, etc.).
Historique de versions
Index10 crée automatiquement des snapshotsde votre projet à chaque interaction avec l'IA. Vous pouvez ainsi revenir en arrière si un changement ne vous convient pas.
- •Snapshots automatiques — créés avant chaque modification de l'IA
- •Restauration en un clic — revenez à n'importe quelle version précédente
- •Comparaison — visualisez les différences entre deux versions
Important : la restauration remplace tous les fichiers du projet par ceux de la version sélectionnée. Les modifications manuelles non publiées seront perdues. Nous vous recommandons de publier avant de restaurer.
Synchronisation avec l'IA
Lorsque l'IA modifie un fichier, les changements sont reflétés en temps réeldans l'éditeur :
- •Le fichier s'ouvre automatiquement si l'IA le crée ou le modifie
- •L'aperçu en direct se rafraîchit instantanément (Hot Module Replacement)
- •Si vous modifiez un fichier manuellement, l'IA en tiendra compte lors de sa prochaine intervention