まなびのすけ
ホーム全記事Web開発Git GitHub Actionsを使ってみた|node/npmを入れずにCI/CDを回す仕組み

GitHub Actionsを使ってみた|node/npmを入れずにCI/CDを回す仕組み

Web開発 2026.08.25 更新

GitHub Actions(ギットハブ・アクションズ)は、GitHubへのプッシュやプルリクエストをきっかけに、ビルド・テスト・デプロイなどの処理を仮想マシン上で自動実行できるCI/CDプラットフォームです。この記事では、Web開発に関わる人が知っておきたいGitHub Actionsの基本をまとめました。

GitHub Actionsとは?

GitHub Actionsは、コードの開発作業(CI/CD)を自動化するプラットフォームです。GitHubへのプッシュやプルリクエストの作成をトリガーにし、GitHubが用意する仮想マシン上で、テスト・ビルド・デプロイなどを実行できます。

  • CI(Continuous Integration)は、マージ前後で自動でテストやビルドを行う仕組みのこと
  • CD(Continuous Delivery / Deployment)は、CIを通ったコードを自動で本番環境へ送る準備をしたりデプロイする仕組みのこと
  • 実行内容は、リポジトリにあるYAML形式のファイルで定義

GitHubそのものの基本はGitHubの記事にまとめています。

GitHub Actionsの主な使い方

  • 自動テスト(CI)
    プルリクエスト作成時にテストやコードスタイルチェック(Lint)を実行し、バグを早期発見する
  • 自動デプロイ(CD)
    mainブランチにコードがマージされた際、サーバーへ自動でファイルをアップロードする
  • タスク自動化
    放置されたIssueの自動クローズや、特定の操作に対するSlackへの通知などにも使える

GitHub Actionsの基本構成要素

GitHub Actionsは、次の5つの要素の組み合わせで動きます。

要素説明
Workflow自動化する処理全体のプロセス。.github/workflows/ディレクトリ配下にYAML形式で記述する
Eventワークフローを実行させるきっかけ。pushpull_requestなど
Job同じ仮想マシン上で実行されるステップのまとまり
Stepジョブ内で順番に実行される処理命令
Action再利用可能な最小単位の処理。GitHub Marketplaceで共有されているものを呼び出せる

GitHub Actionsが使われる理由

  • 外部のCI/CDツールを別途連携する必要がない
  • GitHubのリポジトリ管理とワークフローを同じ画面で扱える
  • YAMLファイルをリポジトリに置くだけで実行できる
  • GitHub Marketplaceで公開されている既存のActionを組み込んで、そのまま利用できる
  • 無料で使える(パブリックリポジトリは標準ランナーの実行時間が無料、プライベートリポジトリもFreeプランで月2,000分まで無料)

このサイトではどう使ってる?

このサイト(まなびのすけ)の制作環境では、ローカルにNode.js・npmが入っていないので、ビルド処理はGitHub Actions上で行なっています。

具体的には以下のように設定しました。

staging環境に反映する流れ

stagingブランチへpushすると、以下が自動で実行されます。

  1. GitHubの仮想マシン上にリポジトリをコピー
  2. Node.js環境を構築してビルド処理を実行
  3. Basic認証用の.htaccessを生成
  4. staging/ディレクトリへデプロイ(.htaccessファイルは内容が変わらない限り、デプロイされるのは初回のみ)

ワークフローの実体は.github/workflows/deploy-staging.ymlにあります。

本番公開する流れ

mainブランチへpush(stagingブランチをmainへmerge)すると、以下が自動で実行されます。

  1. GitHubの仮想マシン上にリポジトリをコピー
  2. Node.js環境を構築してビルド処理を実行
  3. 本番用ディレクトリへデプロイ(staging/ディレクトリは削除対象から除外)

ワークフローの実体は.github/workflows/deploy.ymlにあります。

よくある質問(FAQ)

Q. GitHub Actionsは無料で使えますか?

パブリックリポジトリでは標準ランナーの実行時間が無料です。プライベートリポジトリでも、Freeプランで月2,000分の無料実行時間が用意されており、Pro・Teamプランでは月3,000分になります。無料枠を超えた分は従量課金になります。

Q. GitHub Actionsのワークフローファイルはどこに置きますか?

リポジトリの.github/workflows/ディレクトリに、.ymlまたは.yaml拡張子のYAML形式で置きます。GitHubはこのディレクトリ配下のファイルを自動で検出します。

Q. GitHub Actionsと他のCI/CDツールとの違いは何ですか?

JenkinsやCircleCIなど外部ツールと違い、リポジトリのホスティングとワークフローの実行がGitHub上で完結する点が特徴です。GitHub Marketplaceの既存Actionを呼び出すだけで、多くの処理を自作せずに組み込めます。

参考文献

最新の記事

一覧へ

Metaデザインシステム「Astryx」まとめ

デザイン2026.08.26

OGP画像を自動生成してみた

Web開発2026.08.25

コミット前に秘密情報を自動検知するGitleaksを入れてみた

Web開発2026.08.24

WEBサイトの改善ページを特定する簡易ツールを作ってみた

Web開発2026.08.20

GA4でよく使う基本指標|セッション・エンゲージメント・キーイベント

Web開発2026.08.19

PageSpeed Insightsでこのサイトの表示速度を計測してみた

Web開発2026.08.16