# Écriture et stockage de votre code

Suivez le workflow de base du développeur pour créer une branche, écrire du code et ouvrir une pull request à l’aide de Copilot et GitHub Desktop.

Vous allez maintenant créer la fonctionnalité du site web que vous avez prévue : une page qui répertorie les dépôts mis en favori. Au fil du processus, vous suivrez le processus de travail de base du développeur — en configurant un espace de travail, en apportant et en enregistrant vos modifications, puis en les proposant à la révision — à l’aide de branches, de commits et d’une pull request.

## Logiciels requis

* Clone local de votre `stargazers-log` référentiel. Si vous ne l’avez pas encore configuré, consultez [Connecting to your code locally](/fr/enterprise-server@3.21/get-started/start-your-journey/connecting-to-your-code-locally).

## Création d’une branche

Une branche vous permet de travailler sur votre fonctionnalité dans son propre espace, sans modifier la `main` copie de votre code jusqu’à ce que vous soyez prêt.

1. Ouvrez GitHub Desktop.
2. En haut de l’application, cliquez sur **Current Branch**, puis sur **Nouvelle branche**.
3. Nommez la branche `add-starred-list`, puis cliquez sur **Créer une branche**.
4. Cliquez sur **Publier la branche** pour rendre la branche disponible sur GitHub.

## Création du code du site web

Votre fonctionnalité a besoin de quelques fichiers : exemples de données, feuille de style, script pour afficher les données et page d’accueil mise à jour.

Vous pouvez écrire ces fichiers vous-même ou demander Copilot, un assistant IA, de les générer. Chaque compte GitHub inclut l’accès à GitHub Copilot gratuit ainsi qu’une allocation de crédits d’IA, afin que vous puissiez commencer à utiliser Copilot immédiatement.

Pour en savoir plus sur les plans disponibles et sur le Copilot fonctionnement de l’utilisation, consultez [Plans de GitHub Copilot](/fr/enterprise-cloud@latest/copilot/get-started/plans) dans la GitHub Enterprise Cloud documentation.

Ouvrez Discussion avec Copilot dans votre éditeur et demandez-lui de créer les fichiers avec une invite comme la suivante.

<!-- markdownlint-disable search-replace -->

```text copy
Create a starred repositories page for my software project. Add:
- events.json with sample data for a few starred repositories
- style.css to style a simple list
- script.js to fetch events.json and render the list
- an update to index.html that links style.css and script.js

Use the code written in https://docs.github.com/get-started/start-your-journey/creating-and-changing-your-code.
```

<!-- markdownlint-enable search-replace -->

<a href="vscode://GitHub.Copilot-Chat?ref_product=copilot&ref_type=engagement&ref_style=button" target="_blank" class="btn btn-primary mt-3 mr-3 no-underline" aria-label="Open Copilot Chat in Visual Studio Code">
<span>OuvrirDiscussion avec CopilotdansVS Code</span><svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-link-external" aria-label="link external icon" role="img"><path d="M3.75 2h3.5a.75.75 0 0 1 0 1.5h-3.5a.25.25 0 0 0-.25.25v8.5c0 .138.112.25.25.25h8.5a.25.25 0 0 0 .25-.25v-3.5a.75.75 0 0 1 1.5 0v3.5A1.75 1.75 0 0 1 12.25 14h-8.5A1.75 1.75 0 0 1 2 12.25v-8.5C2 2.784 2.784 2 3.75 2Zm6.854-1h4.146a.25.25 0 0 1 .25.25v4.146a.25.25 0 0 1-.427.177L13.03 4.03 9.28 7.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.75-3.75-1.543-1.543A.25.25 0 0 1 10.604 1Z"></path></svg>
</a><br><br>

Passez en revue les Copilot éléments générés, puis ajustez les fichiers pour qu’ils correspondent aux exemples ci-dessous.

Si vous n’avez pas utilisé Copilot, utilisez votre éditeur de code pour créer les fichiers ci-dessous dans la `add-starred-list` branche.

1. Créez un fichier nommé `events.json` avec les exemples de données suivants. Enregistrez le fichier.

   ```json copy
   [
     { "name": "octocat/Hello-World", "starred": "2024-01-15" },
     { "name": "github/docs", "starred": "2024-02-02" },
     { "name": "octo-org/octo-repo", "starred": "2024-03-21" }
   ]
   ```

2. Créez un fichier nommé `style.css` avec les styles suivants. Enregistrez le fichier.

   ```scss copy
   body {
     font-family: sans-serif;
     margin: 2rem;
   }

   ul {
     list-style: none;
     padding: 0;
   }

   li {
     padding: 0.5rem 0;
     border-bottom: 1px solid #ddd;
   }
   ```

3. Créez un fichier nommé `script.js` avec le code suivant. Enregistrez le fichier.

   ```javascript copy
   fetch("events.json")
     .then((response) => response.json())
     .then((events) => {
       const list = document.querySelector("#starred");
       events.forEach((event) => {
         const item = document.createElement("li");
         item.textContent = `${event.name} — starred ${event.starred}`;
         list.appendChild(item);
       });
     });
   ```

4. Mettez à jour `index.html` pour lier les nouveaux fichiers et conserver la liste. Enregistrez le fichier.

   ```html copy
   <!DOCTYPE html>
   <html lang="en">
     <head>
       <meta charset="utf-8">
       <title>Stargazers log</title>
       <link rel="stylesheet" href="style.css">
     </head>
     <body>
       <h1>Stargazers log</h1>
       <p>A log of the repositories I've starred.</p>
       <ul id="starred"></ul>
       <script src="script.js"></script>
     </body>
   </html>
   ```

## Validation (commit) et envoi (push) de vos modifications

La validation enregistre un instantané de vos modifications, et le push les envoie vers GitHub, où elles seront stockées dans votre dépôt.

1. Dans GitHub Desktop, passez en revue vos fichiers modifiés dans la barre latérale gauche.
2. En bas de la barre latérale, dans le champ **Résumé** , tapez un message de validation tel que `Add starred repositories list`.
3. Cliquez sur **Valider 4 fichiers dans add-starred-list**.
4. Cliquez sur **Push origin** pour envoyer votre commit vers GitHub.

## Ouverture d'une demande de fusion

Une pull request propose les modifications de votre branche pour examen avant leur fusion dans `main`.

1. Dans GitHub Desktop, cliquez sur **Aperçu de la demande de tirage**, puis sur **Créer une demande de tirage**. Votre navigateur ouvre le formulaire de pull request sur GitHub.
2. Passez en revue le titre et la description, puis ajoutez une note sur ce que fait votre fonctionnalité.
3. Cliquez sur **Créer une pull request**.

## Ce que vous avez accompli

| Tâche                              | Résultat                                                                                                                |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
| Création d’une branche             | Vous avez créé un espace isolé pour votre fonctionnalité avec `add-starred-list`.                                       |
| Écrit le code                      | Vous avez ajouté les fichiers de la fonctionnalité à votre branche, avec l’aide facultative de Discussion avec Copilot. |
| Vous avez poussé vos modifications | Vous avez enregistré les modifications de votre branche sur GitHub.                                                     |
| Ouverture d’une pull request       | Vous avez proposé vos modifications pour révision.                                                                      |

## Lectures complémentaires

* [À propos des plans et avantages individuels GitHub Copilot](/fr/enterprise-cloud@latest/copilot/concepts/billing/individual-plans)
* [Facturation basée sur l’utilisation pour les individus](/fr/enterprise-cloud@latest/copilot/concepts/billing/usage-based-billing-for-individuals)
* [Suivi de votre utilisation de GitHub AI Credits](/fr/enterprise-cloud@latest/copilot/how-tos/manage-and-track-spending/monitor-ai-usage) dans la GitHub Enterprise Cloud documentation

## Étapes suivantes

* Avant de fusionner, passez en revue vos propres modifications pour détecter les problèmes au début. Passez à [Examen de vos modifications proposées](/fr/enterprise-server@3.21/get-started/start-your-journey/reviewing-your-proposed-changes).