Déploiement automatique de votre site web

Votre fonctionnalité est fusionnée. Vous pouvez donc maintenant la partager. Dans ce tutoriel, vous allez configurer le déploiement automatique afin que chaque envoi (push main ) publie votre projet logiciel sur un site web en direct.

Logiciels requis

• Un dépôt stargazers-log avec votre fonctionnalité intégrée. Si vous ne l’avez pas encore fusionné, consultez Examen de vos modifications proposées.

Activation de GitHub Pages

Configurez-le GitHub Pages pour héberger votre site et utilisez-le GitHub Actions pour générer et le publier.

1. Dans GitHub, accédez à votre dépôt stargazers-log.
2. Sous le nom de votre référentiel, cliquez sur Paramètres.
3. Dans la barre latérale, dans la section « Code et automatisation », cliquez sur Pages.
4. Sous « Générer et déployer », dans la liste déroulante Source , sélectionnez GitHub Actions.

Conservez les autres paramètres par défaut. Ensuite, vous allez créer votre propre flux de travail pour générer et déployer automatiquement votre site.

Création d’un flux de travail de déploiement

Un flux de travail est un ensemble d’étapes automatisées qui GitHub Actions s’exécutent pour vous. Ajoutez-en un qui génère et déploie votre site chaque fois que vous envoyez (push) vers main.

1. Dans votre référentiel, créez un fichier nommé .github/workflows/deploy.yml.

   1. Sur la page principale de votre stargazers-log référentiel, au-dessus de la liste des fichiers, cliquez sur , puis cliquez sur Créer un nouveau fichier.
   2. Dans le champ du nom de fichier, tapez .github/workflows/deploy.yml.

2. Ajoutez le contenu de flux de travail suivant.

   YAML

   name: Deploy to GitHub Pages
   
   on:
     push:
       branches:
         - main
   
   permissions:
     contents: read
     pages: write
     id-token: write
   
   jobs:
     deploy:
       runs-on: ubuntu-latest
       environment:
         name: github-pages
         url: ${{ steps.deployment.outputs.page_url }}
       steps:
         - name: Checkout
           uses: actions/checkout@v6
         - name: Setup Pages
           uses: actions/configure-pages@v5
         - name: Upload artifact
           uses: actions/upload-pages-artifact@v4
           with:
             path: '.'
         - name: Deploy to GitHub Pages
           id: deployment
           uses: actions/deploy-pages@v4
   

3. Validez le fichier directement dans la main branche.

Présentation du flux de travail

Chaque partie du flux de travail a un travail à effectuer :

• on indique GitHub Actions d’exécuter le flux de travail sur chaque envoi (push) vers main.
• permissions accorder au flux de travail l’accès dont il a besoin pour publier sur GitHub Pages.
• environment connecte la tâche à votre site GitHub Pages et rend l’URL publiée accessible sous la forme de ${{ steps.deployment.outputs.page_url }}.
• steps Consultez votre code, préparez GitHub Pages, chargez vos fichiers en tant qu’artefact et déployez-les sur votre site en direct.

Affichage de votre site en direct

Après avoir validée le flux de travail, GitHub Actions l’exécute automatiquement.

1. Dans votre référentiel, cliquez sur l’onglet Actions pour surveiller l’exécution du flux de travail.
2. Cliquez sur la dernière exécution du flux de travail pour afficher un résumé des détails du travail.
3. Une fois l’exécution terminée, ouvrez votre site publié à l’adresse https://YOUR-USERNAME.github.io/stargazers-log/. Remplacez par votre nom d’utilisateurYOUR-USERNAME et remplacez d’hôte.
   • Par exemple, si votre GitHub nom d’utilisateur de compte est octocat, votre site est à l’adresse https://octocat.github.io/stargazers-log/.

À partir de maintenant, chaque push sur main redéploie votre site avec vos dernières modifications.

Ce que vous avez créé

Dans cette série, vous avez créé un projet logiciel complet et pratiqué le GitHub flux de travail :

Stage	Ce que vous avez appris
Création de votre projet logiciel	Référentiels, fichiers README
Planification de votre travail	Problèmes, projets (tableaux de projet)
Connexion locale
GitHub DesktopClonage
Écriture et stockage de code	Branches, validations, demandes de tirage Copilot
Examen des modifications	Révisions de pull request, Copilot
Déploiement automatique
GitHub Actions, GitHub Pages

Étapes suivantes

• Développez votre compréhension de Git et GitHub. Pour plus d’informations, consultez « Ressources d’apprentissage Git et GitHub ».
• Explorez Discussion avec Copilot pour apprendre plus rapidement et obtenir de l’aide à mesure que vous codez. Pour plus d’informations, consultez À propos de GitHub Copilot Chat.
• Allez plus loin avec l’IA et découvrez comment les agents peuvent agir comme un partenaire de codage pratique en transformant des idées en petites étapes actionnables, en générant des exemples et en gérant le travail répétitif. Pour plus d’informations, consultez Concepts pour les agents GitHub Copilot.
• En savoir plus sur l’automatisation de vos projets logiciels avec les flux de travail GitHub Actions. Pour plus d’informations, consultez « Présentation des GitHub Actions ».
• Ajoutez un domaine personnalisé ou explorez d’autres façons de publier votre site web avec GitHub Pages. Pour plus d’informations, consultez « Démarrage avec GitHub Pages ».