> ## Documentation Index
> Fetch the complete documentation index at: https://docs.base44.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Onglet Code
> Modifiez le code source de votre application directement dans l'onglet Code de Base44 avec prévisualisation en direct et contrôle total pour développeur.
L'onglet Code vous permet de visualiser et de modifier le code source de votre application directement, vous donnant le contrôle sur la fonctionnalité, la conception et le comportement de votre application tout en voyant les changements immédiatement.
L'onglet Code s'adresse aux développeurs qui veulent plus de contrôle. Pour
des modifications plus simples, utilisez l'éditeur visuel et les outils IA de
Base44.
## Accéder à l'onglet Code
**Pour ouvrir l'onglet Code :**
1. Allez dans le tableau de bord de votre application.
2. Cliquez sur l'onglet **Code**.
L'onglet Code affiche les [fichiers de votre projet](../overview/project-structure) dans un explorateur de fichiers à gauche, l'éditeur de code occupant l'espace principal.
## Naviguer dans votre base de code
Utilisez la fonctionnalité **Files used in this page** pour voir quels fichiers alimentent la page que vous prévisualisez. Cela vous montre exactement quels fichiers de code sont en cours d'exécution, afin que vous sachiez où aller lorsque vous voulez modifier la page ou enquêter sur un problème.
Chaque entrée de la liste affiche le nom du fichier et son chemin de dossier, regroupé par emplacement dans votre projet, comme les pages ou les composants.
**Pour afficher les fichiers utilisés sur une page :**
1. Allez dans votre éditeur d'application.
2. Cliquez sur l'icône **More Actions** en haut à droite.
3. Cliquez sur **Files used in this page**.
Si vous voulez passer de cette vue ciblée à la structure complète des fichiers,
cliquez sur **See all files**. Cela vous amène à la vue complète des fichiers
de code pour que vous puissiez continuer à explorer.
## Modifier avec prévisualisation en direct
L'onglet Code propose une vue en écran partagé qui affiche votre code d'un côté et une prévisualisation en direct de votre application de l'autre. Cela vous permet de voir les changements instantanément sans changer de contexte.
**Pour modifier avec prévisualisation en direct :**
1. Ouvrez un fichier dans l'onglet Code.
2. Cliquez sur le bouton d'écran partagé dans le coin supérieur droit.
3. Modifiez votre code à gauche et voyez vos changements à droite.
**Chaque fois que vous apportez des modifications au code :**
* Cliquez sur **Save** en bas de l'écran pour appliquer vos changements et actualiser la prévisualisation avec le dernier code.
* Cliquez sur **Discard** en bas de l'écran si vous voulez abandonner toutes les modifications non enregistrées et revenir à la dernière version enregistrée du fichier.
**Important :** Si vous modifiez le code de votre application, assurez-vous de
cliquer sur **Publish** pour qu'ils soient mis en ligne sur votre application.
Lorsque vous êtes prêt à quitter l'écran partagé, cliquez sur **Exit split**.
Pour le développement local avec votre propre IDE, consultez [Intégration GitHub](../local-development/github).
## Examiner les modifications de code de l'IA
Lorsque l'IA modifie votre application, vous pouvez ouvrir la modale **Code changes** pour voir exactement ce qu'elle a modifié avant la publication. La modale affiche chaque fichier que l'IA a touché, regroupé par dossier, avec une vue diff pour chacun.
**Pour ouvrir la modale Code changes :**
1. Allez dans le chat IA dans votre éditeur d'application.
2. Survolez un message où l'IA a modifié ou créé un fichier.
3. Cliquez sur l'icône à trois points à côté de cette modification et sélectionnez **View Changes**.
Une modale s'ouvre avec une arborescence de fichiers à gauche et le diff du fichier sélectionné à droite. Une barre de statistiques en haut détaille combien de fichiers ont été ajoutés, modifiés et supprimés.
Les fichiers de l'arborescence sont codés par couleur selon leur état :
* **Vert** pour les fichiers nouvellement ajoutés.
* **Ambre** pour les fichiers modifiés, qui s'ouvrent dans une vue diff côte à côte.
* **Rouge** pour les fichiers supprimés.
Cliquez sur n'importe quel fichier dans l'arborescence pour accéder directement à son diff.
## FAQ
Oui. Vous pouvez ouvrir et modifier n'importe quel fichier de code qui apparaît
dans le panneau Code files, y compris les pages, les composants, les mises en
page et les helpers d'entités. Si une partie de l'application est générée pour
vous, elle apparaît toujours comme du code normal que vous pouvez modifier.
Non. Vous pouvez travailler dans l'éditeur de code en pleine largeur si vous
préférez plus d'espace. L'écran partagé est utile lorsque vous voulez voir
la prévisualisation à côté de votre code, mais vous pouvez le désactiver à
tout moment et le rouvrir plus tard.
Discard supprime toutes les modifications non enregistrées dans le fichier
actif et restaure la dernière version enregistrée. C'est utile si vous
essayez quelque chose qui ne fonctionne pas et que vous voulez revenir
rapidement en arrière. Une fois que vous cliquez sur Discard, vous ne pouvez
pas récupérer le code non enregistré de cette session.
Vous n'avez pas besoin d'être un expert, mais une familiarité de base avec
React et JSX aide. Vous pouvez commencer par de petites modifications comme
la mise à jour de texte, le remplacement de composants ou la modification de
styles simples, puis passer à une logique plus avancée à mesure que vous
gagnez en confiance.
Cette page a été traduite à l'aide de l'IA. Pour les informations les plus précises et à jour, consultez la [version anglaise](/).