0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

XserverにLaravel Inertia React をデプロイする(GitHubActions)

Last updated at Posted at 2024-09-08

はじめに

こんにちは、エンジニアのkeitaMaxです。

今回は、XserverにLaravel Inertia React をGitHubActionsを使用してデプロイしようと思います。

GitHubActionsを以下のように作成します。

deploy.yml
name: deploy

on:
  push:
    tags:
      - 'stg.v.*'

jobs:
  deploy:
    runs-on: ubuntu-latest
    defaults:
      run:
        working-directory: ./src
    steps:
      - uses: actions/checkout@v2
      - name: dokcer-compose up
        run: |
          docker compose up -d
      - name: composer install
        run: |
          docker compose exec app composer install
      - name: Copy .env
        run: |
          docker compose exec app php -r "file_exists('.env') || copy('.env.example', '.env');"
      - name: Generate key
        run: |
          docker compose exec app php artisan key:generate
      - name: npm run install
        run: |
          docker compose exec app npm install
      - name: npm build
        run: |
          docker compose exec app npm run build
      - name: FTP-Deploy-Action
        uses: SamKirkland/FTP-Deploy-Action@v4.3.5
        with:
          server: ${{ secrets.PRD_FTP_SERVER }}
          username: ${{ secrets.PRD_FTP_USERNAME }}
          password: ${{ secrets.PRD_FTP_PASSWORD }}
          local-dir: ./src/
          server-dir: ./

こちらリリースタグをstg.v.1のようにした時にデプロイできるようにしました。

下記の部分でやっております。

on:
  push:
    tags:
      - 'stg.v.*'

参考にした記事は記事の一番下にリンクを置いておきます。

GitHubの設定

GitHubに以下の3つを登録しなくてはいけません。

          FTP_SERVER: ${{ secrets.FTP_SERVER }}
          FTP_USERNAME: ${{ secrets.FTP_USERNAME }}
          FTP_PASSWORD: ${{ secrets.FTP_PASSWORD }}

こちらはxserverのサーバパネルから確認することができます。
サーバーパネルのサブFTPアカウント設定からサブFTPアカウント設定をします。

スクリーンショット 2024-08-29 11.45.05.png

そこで設定したFTPユーザーIDがFTP_USERNAMEになります。
また、同じ画面で設定したパスワードがFTP_PASSWORDになります。

FTP_SERVERはサーバのホスト名となり、sv***.xserver.jpのようなものです。
サーバーパネルのURLについています。

参考URL:https://www.xserver.ne.jp/manual/man_ftp_setting.php

これをGitHubに設定します。

リポジトリ → Settings → secrets and variables → actions

から設定できます。

設定できると以下のようになります。

スクリーンショット 2024-08-29 11.46.07.png

動かしてみる

実際にタグを打って動かしてみます。

GuiHubのリポジトリのコードの右下にあるReleasesをクリックします。

スクリーンショット 2024-08-29 11.47.28.png

Draft a new releaseをクリックします。

スクリーンショット 2024-08-29 11.48.32.png

Choose tagからstg.v.2みたいな感じでタグの名前を入力し、+ボタンを押して作成します。

スクリーンショット 2024-08-29 11.49.22.png

最後にPublishリリースをおします。

スクリーンショット 2024-08-29 11.50.42.png

すると、以下のようにGitHubActionが動き、デプロイできます。

スクリーンショット 2024-08-29 11.54.00.png

おわりに

この記事での質問や、間違っている、もっといい方法があるといったご意見などありましたらご指摘していただけると幸いです。

最後まで読んでいただきありがとうございました!

次の記事

参考

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?