GitHub Actionsを利用してXserverに自動デプロイする


目的

(現状)
ローカル開発→作業ブランチPush→masterにマージ→XserverにFileZillaにてデプロイ

(理想)
ローカル開発→作業ブランチPush→masterにマージ→Xserverに自動デプロイ

GitHubと連動して自動デプロイを行う場合はCircleCIを利用するのが一般的かなと思っていたのですが、GitHub Actionsでもできるとのことでしたので調べてやってみました。

各種設定

1. Xserverの設定

特に必要ありません。

2. GitHub Actionsの設定

2.1 GitHubのsettingsにてFTP情報を設定する

GitHub対象リポジトリのsettings > secretsにて下記情報を設定します。

  • FTP_SERVER:ftpサーバのホスト
  • FTP_USERNAME:ftpサーバのアカウント名
  • FTP_PASSWORD:ftpサーバのパスワード

FTPソフトの設定 | レンタルサーバー【エックスサーバー】

ここで設定した値はyml記述時に利用します。

2.2 deploy.ymlの作成

対象リポジトリ直下に.github/workflows/ディレクトリを作成し、その下にdeploy.ymlファイルを設置します。このファイルにデプロイ時の指示を記述していきます。

今回はビルドはないので純粋にデプロイだけ行います。

.github/workflows/deploy.yml
on:
  push:
    branches:
      - master
name: Deploy
jobs:
  FTP-Deploy-Action:
    name: FTP-Deploy-Action
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@master
      - name: FTP-Deploy-Action
        uses: SamKirkland/[email protected]
        env:
          FTP_SERVER: ${{ secrets.FTP_SERVER }}
          FTP_USERNAME: ${{ secrets.FTP_USERNAME }}
          FTP_PASSWORD: ${{ secrets.FTP_PASSWORD }}
          LOCAL_DIR: ./
          REMOTE_DIR: /デプロイ対象のサイト/public_html/

実施

上記で設定が完了したので、実際に試してみます。

作業ブランチをmasterにマージすると設定したアクションが動き出します。

無事完了したようです!

サイトを確認したところデプロイできておりました🎉

最後に

今回は単純にデプロイしただけでしたが、フロントのソースをビルドした後にデプロイみたいなことも簡単にできそうでしたので機会があれば試してみたいと思います。

参考

GitHub Actionsを使ってFTP自動デプロイ(Webサイト公開)を実現!ソフトを使った手動アップロードを卒業する