Web サイトを自動的にデプロイする

機能がマージされるので、今すぐ共有できます。このチュートリアルでは、 main にプッシュするたびにソフトウェアプロジェクトをライブ Web サイトに発行するように、自動展開を設定します。

メモ

GitHub Pages サイトの URL は、使用するGitHubのバージョンによって異なります。 * GitHub.com上で、サイトは YOUR-USERNAME.github.io/REPOSITORY で公開されます。 * GitHubのデータ所在地でGHE.comを使用する場合、サイトはpages.SUBDOMAIN.ghe.com/YOUR-USERNAME/REPOSITORYに発行されます。ここで、SUBDOMAINは企業のサブドメインです。 * GitHub Enterprise Serverでは、サイトは pages.HOSTNAME/YOUR-USERNAME/REPOSITORY で発行されます。ここで、HOSTNAMEはGitHub Enterprise Server インスタンスのホスト名です。

前提条件

あなたがマージした機能を含む stargazers-log リポジトリ。まだマージしていない場合は、「提案された変更の確認」を参照してください。

GitHub Pages の有効化

サイトをホストするように GitHub Pages を設定し、 GitHub Actions を使用してサイトをビルドして発行します。

GitHubで、stargazers-log リポジトリに移動します。
リポジトリ名の下の [設定] をクリックします。
サイドバーの [コードと自動化] セクションで、[ ページ] をクリックします。
[ビルドとデプロイ] の [ ソース ] ドロップダウンで、 GitHub Actions を選択します。

他の設定は既定値のままにします。次に、サイトを自動的にビルドして展開する 独自のワークフロー を作成します。

デプロイワークフローの作成

ワークフローは、GitHub Actions が代わりに実行する一連の自動化されたステップです。 mainにプッシュするたびにサイトをビルドしてデプロイするものを追加します。

リポジトリで、.github/workflows/deploy.yml という名前のファイルを作成します。
1. ファイルの一覧の上にあるstargazers-log リポジトリのメインページで、[] をクリックし、[新しいファイルの作成] クリックします。
2. ファイル名フィールドに、.github/workflows/deploy.yml と入力します。

次のワークフローコンテンツを追加します。

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@v2
        with:
          path: '.'
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v2

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@v2
        with:
          path: '.'
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v2

ファイルを main ブランチに直接コミットします。

ワークフローについて

ワークフローの各部分には、次の操作を行うジョブがあります。

**on**は、GitHub Actionsへのプッシュごとにワークフローを実行するようにmainに指示します。
permissions を使用して、 GitHub Pagesに発行する必要があるアクセス権をワークフローに付与します。
environment は、ジョブを GitHub Pages サイトに接続し、発行された URL を ${{ steps.deployment.outputs.page_url }}として公開します。
steps コードをチェックアウトし、 GitHub Pagesを準備し、成果物としてファイルをアップロードして、ライブサイトにデプロイします。

ライブサイトを表示する

ワークフローをコミットすると、 GitHub Actions 自動的に実行されます。

リポジトリで、[ アクション] タブをクリックしてワークフローの実行を監視します。
最新のワークフロー実行をクリックすると、ジョブの詳細の概要が表示されます。
実行が完了したら、発行済みサイトを https://pages.HOSTNAME/YOUR-USERNAME/stargazers-log/で開きます。 YOUR-USERNAMEをユーザー名に置き換え、HOSTNAMEをGitHub Enterprise Serverホスト名に置き換えます。
- たとえば、あなたの GitHub アカウントのユーザー名が octocat、あなたのサイトは https://pages.HOSTNAME/octocat/stargazers-log/ になります。

今後は、 main にプッシュするたびに、最新の変更でサイトが再デプロイされます。

作成した内容

このシリーズでは、完全なソフトウェアプロジェクトを構築し、 GitHub ワークフローを実践しました。

段階	学習した内容
ソフトウェアプロジェクトの作成	リポジトリ、README ファイル
作業の計画	問題、プロジェクト (プロジェクトボード)
ローカル接続
GitHub Desktop, クローニング
コードの記述と格納	ブランチ、コミット、プルリクエスト、 Copilot
変更の確認	プルリクエストのレビュー, Copilot
自動的にデプロイする
GitHub Actions、GitHub Pages

次のステップ

Git と GitHubについて理解を深めください。詳細については、「Git とGitHub学習リソース」を参照してください。
コパイロットチャットを調べて、より速く学習し、コードを作成するときにヘルプを取得します。詳細については、ドキュメントの GitHub Enterprise Cloudを参照してください。
AI をさらに深く理解し、アイデアを小さな実用的なステップに変え、例を生成し、反復的な作業を処理することで、エージェントが実用的なコーディングパートナーのように動作する方法を学習します。詳細については、ドキュメントの GitHub Enterprise Cloudを参照してください。
GitHub Actions ワークフローを使用してソフトウェアプロジェクトを自動化する方法について説明します。詳細については、「GitHub Actionsについて」を参照してください。
カスタムドメインを追加するか、 GitHub Pagesを使用して Web サイトを公開するその他の方法を確認します。詳細については、「GitHub Pages 入門」を参照してください。

Get started

この記事で