webサイト制作の勉強|2023年11月クラス用ブログ

ファリカテクニカルアカデミーのwebサイト制作科の授業解説ブログです。フェリカテクニカルアカデミーは池袋にある求職者支援訓練の学校です。

GitHub Actionsを使ってCI/CD化する

GitHub Actionsを使って、最近話題のCI/CD化を進めましょう

CI/CD

Continuous IntegrasionおよびContinuous Deliveryの略称です。どちらもContinuous(=継続的)とあるように、開発からリリースまでの流れをフェーズごとに分断するのではなく、つねに継続的につながっていくものとしてとらえようという考え方です。


on:
  push:
    branches: [main]
name: 🚀 Deploy website on push
jobs:
  web-deploy:
    name: 🎉 Deploy
    runs-on: ubuntu-latest
    steps:
    - name: 🚚 Get latest code
      uses: actions/checkout@v2.3.2

    - name: 📂 Sync files
      uses: SamKirkland/FTP-Deploy-Action@4.0.0
      with:
        server: ${{ secrets.FTP_HOST}}
        username: ${{ secrets.FTP_USERNAME }}
        password: ${{ secrets.FTP_PASSWORD }}
        server-dir: 自身のドキュメントルート内のディレクトリ(一番最初の/から)

  
  


1.githubにaction用リポジトリーを作成
2.action用リポジトリーにFTPパスワードを登録(settings→Secrets)
3.Actionsから「 set up a workflow yourself 」をクリックして、新しいactionを登録
4.ブログに載っている、スクリプトに中身を入れ替える
server: 自身のFTPサーバー名
username: 自身のFTPアカウント名
password: ${{ secrets.ftp_password }}
server-dir: ./git-action/
5.ローカルにクローンを作成
6.mainブランチからdevブランチに切り替えて、index.htmlを作成
7.devブランチにステージ→コミット→プッシュ
8.github上でプルリクし、devをmainにマージ(このタイミングでactionが作動)
9.actionが正しく動いているかサーバーを確認(自身のサーバーのルート/git-action/)
例:1234.com/git-action/