GitHub Actionsを使ってXServerなどレンタルサーバーに自動デプロイしよう🙌

公開日 : 最終更新日 :

  • コーディング

こんにちは、AndHAコーディング部です。

前回の記事ではSourceTreeを使ってコミット間の差分ファイルを出力する方法を紹介しました。

SourceTreeを使ってコミット間の差分ファイルを出力してみよう🥳 | 【運用・改善が得意な仙台のホームページ制作会社】AndHA(アンドエイチエー)

リモートリポジトリをGithubに指定している場合、Github Actionを利用しワークフローを自動化することが出来ます。

Actions | GitHub

今回はよく使われるであろうエックスサーバーに対し、GitHub Actionsを使った自動デプロイを紹介します。

※Mac(macOS 12.0.1)環境で記事作成しています

また、今更感のある記事ですので実務で使う事を想定したステージング環境と本番環境に自動デプロイすることを想定して進めて行きます。

用意する物

  • GitHubアカウント
  • GItHubにアップされたリポジトリ
  • レンタルサーバーの契約(対象をエックスサーバーとしていますが、FTPが使えるサーバーであれば問題ありません。)

この記事を読むことで出来るようになること

  • Gitの操作のみでFTPクライアントなどを使わずファイルのデプロイが行えるようになります

GitHub Actionsとは

GitHubのイベントをトリガーとして任意の処理を実行できるサービスです。

GitHub Actionsのドキュメント – GitHub Docs

例えば、簡単なWebページ制作であればGitHub上でファイルを管理し、開発ブランチ(Develop)から本番ブランチ(Master)にマージしたタイミングで処理を実行できるようになります。

マージしたタイミングで対象のサーバーにファイルをアップすることも可能であり、様々な作業自動化を行うことが出来ます。

ワークフローを定義してみよう

自動デプロイを実現するためにワークフローを構成するYAMLファイルを作成していきます。

テストアップ用のstaging.ymlには下記の様に定義してみましょう。

次に本番アップ用のproduction.ymlには下記の様にします。(異なるのはトリガー以下の指定with内のserver, username, password, server-dir のみとなります。)

server-dirのパス指定はファイルのアップロード先になるため、間違った場所にアップロードされないように十分に注意してください。

上記YAMLファイル内にFTPなどの機密情報を載せるわけにはいきませんので、次項にてGitHub内のSecretsに定義していく方法を解説します。

GitHub Secretsに機密情報を定義

Secretsの画面はGitHubのリポジトリを表示しているページのSettingから遷移することが出来ます。

Settings > Secrets > New repository secret をクリックしてください。

上記画面にて先ほどのNameとValueを設定していきます。

作成したワークローをGitHub Actionsに登録

GitHubのリポジトリを表示しているページ内ヘッダーに配置してあるActionsから遷移することが出来ます。

Actions > set up a workflow yourself をクリックしてください。

それぞれ作成したワークフローを登録していきます。

ファイルネームは staging.yml, production.yml 等としておきます。

完了しましたらStart commitをクリックしましょう。

次の画面で表示されるコミットダイアログは必要に応じて入力をしてください。(書かなくてもOKです。)

続いて2つめのワークフローも登録していきましょう。

New workflowをクリックして同じように進めてください。

作成した2つのワークフローを登録することが出来ました。

上記で準備は完了です。

GitHub Actionを動かしてみる

作業時にはmasterからdevelopなどにチェックアウトして作業を進め、masterにマージすることでActionが実行されます。

指定した場所にアップされました。

検証も完了し、公開する場合にはリポジトリのリリースを行います。

説明は割愛しますので、下記URLから操作方法を確認してください。

リポジトリのリリースを管理する – GitHub Docs

リリースを行うと今度は production.yml が呼び出され定義した別の環境にデプロイが行われます。

こちらも完了するとグリーンのチェックボタンに切り替わり、ログを見ることが出来ます。

本番用のディレクトリに出力されました。

まとめ

GitHub Actionsを使ったFTPの自動デプロイ方法を紹介しました。

今回はsrcディレクトリをそのままアップロードする方法でしたが、フロントエンドのソースをビルドさせてデプロイなども勿論行う事が可能です。

更に定期的な時間指定やWebhookを使った通知をSlackに飛ばしたりなども行う事が出来ます。

是非興味があれば色々試してみてください。

それでは、また。

参考URL

GitHub Actionsのドキュメント – GitHub Docs

ワークフローをトリガーするイベント – GitHub Docs

合わせて読みたい!