上級者は、GitLab CI/CD(継続的インテグレーション/継続的デリバリー、または継続的デプロイメント)を使用して、Kinstaのサイトを更新できます。関連するブランチに新しいコミットをプッシュするたびに、コードの変更が自動的にサイトにデプロイされます。この方法により、WordPressのMySQLデータベースを上書きせずに、継続的にKinsta上の本番環境にコードをプッシュできます。

GitLab CI/CDをセットアップすることで、ローカル環境やKinstaステージング環境からコードをプッシュできるだけでなく、バージョン管理システムも構築できます。以下の例では、ステージング環境を作成し、変更をGitLab経由で本番環境にプッシュします(Kinstaの「本番環境への反映」機能はバイパスします)。

GitLabのアカウントをまだ持っていない場合は、サインアップページから作成してください。

Kinstaのサイトの作成

このチュートリアルでは、まずKinstaに新しい空のサイトを作成し、後でWordPressをインストールします。弊社で既にWordPressサイトを運営されている場合でも、以下の手順でサイトをGitLabに接続することができます。

MyKinstaで、「WordPressサイト」ページに移動し、右上の「サイトを追加する」をクリックします。右上の「サイトを追加する」ボタンをクリックし、ドロップダウンメニューから「新規サイト作成」を選択してください。モーダル/ポップアップウィンドウで「WordPressをインストールしない」オプションを選択し、「次へ」ボタンをクリックします。

必須フィールドに入力し、「次へ」ボタンをクリックして各ウィンドウに進み、サイト作成プロセスを終了します。

 

MyKinstaで空のサイトを作成する
MyKinstaで空のサイトを作成する

GitLabプロジェクトの作成

まずGitLabにアクセスし、「Create a project(プロジェクトの作成)」をクリックして、Kinstaのサイト用に新しいリポジトリを作成します。

GitLabでプロジェクトを作成する
GitLabでプロジェクトを作成する

「Blank Project(空のプロジェクト)」オプションを選択し、「プロジェクト名」と「Project slug(プロジェクトスラッグ)」を入力します。

GitLabで空のプロジェクトを作成する
GitLabで空のプロジェクトを作成する

「可視レベル」オプションでは、リポジトリを「プライベート」に設定することをお勧めします。このGitLabリポジトリには有料のプラグインやテーマのコードが含まれる可能性があります。リポジトリを「パブリック」に設定すると、誰でもインターネットからアクセスし、あなたが購入した製品をダウンロードできてしまいます。

新しいプロジェクトの設定が完了したら、「Create project(プロジェクトを作成)」をクリックして続行します。

SSH鍵の構成

次に、GitLabとMyKinstaの2つのプラットフォームが通信できるように、SSH鍵を追加します。

GitLabにSSH公開鍵を追加する

まず、Kinstaサイトの本番環境にSSH接続し、以下のcatコマンドを実行して、SSH公開鍵を表示します。

cat ~/.ssh/id_rsa.pub

公開鍵は、以下のような形式です。コマンドラインウィンドウを開いたままにして、ウェブブラウザでGitLabに戻ります。

ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABgQC7zdjwd6UIUJ5t4YnXNi6yhdHgrvIV2xgjvJ3592wd1Hzmnta4dau7yOIxQDU7/oNIr6DIskuIUii5ruGi4YZpIwB/AWGrn/uWb+FXJFiQHMZq9rCFcqtZXT0fyzKiSNkblV4F1RaPQJRvxfSUsSQ3jJU3FX8CF1c4R40CiBKkSHM8uavVIIESzgIHRiWVxkL9F6SKzg8GeTctJaAa3W+q1F1T60OKYmzH3OLdA37ZNmkm1CYWa8SF0JjOszxOnPwhfQ49P5r+rftXRFLz/7hGJ8CnUyzErSiUdUKNknUAB+w4KEZshQSNuiken0+GKqIw83dWWSyjiJJigcyDez2s+3AqDLHPG45NoBEXuBXjPQ9C08hokVyKlbzd/P2qvcnzUT5S6zTuaYOW+50+fiXeYkJlEoYYxoGRVx6FFdFqWyJx5UyaDv7QY3iQH0qct1iq9XGXMhBxIecIAEPUwF8nOp15in8L+5UIFMiNnihztTAXysc+8xvVwbuRlQIeR/E= ansible-generated on fvj-kinstagit

GitLabの右上にあるユーザーアイコンのドロップダウンをクリックし、「設定」をクリックします。

GitLabの「設定」ページ
GitLabの「設定」ページ

「設定」ページで、サイドバーの「SSH鍵」をクリックします。

GitLabのSSH鍵
GitLabのSSH鍵

「キー」フィールドにSSH公開鍵を貼り付けます。「Title(タイトル)」フィールドには自動で名前が入力されますが、必要に応じて自由に変更できます。GitLabでは、SSH鍵の有効期限も設定できます。このオプションは、インフラのセキュリティプロトコルの一部として、SSH鍵を無効化し、ローテーションする場合に便利です。必要ない場合は、「Expires at(有効期限)」フィールドを空白のままにしておいてください。

GItLabでのSSH鍵の追加
GItLabでのSSH鍵の追加

構成を再確認後、「キーを追加」をクリックして終了します。

MyKinstaにSSH公開鍵を追加する

SSH公開鍵をGitLabに追加したら、同じ鍵をMyKinstaにも追加する必要があります。この手順では、SSH公開鍵をサイトの「authorized_keys」ファイル(rootとMyKinstaのみ書き込み可能)に追加します。これにより、GitLabがSSHでサイトにアクセスしてコードの変更をデプロイできるようになります。MyKinstaの画面右上にあるユーザーアイコンをクリックし、ドロップダウンメニューから「ユーザー設定」を選択します。

MyKinstaのユーザー設定
MyKinstaのユーザー設定

スクロールダウンして、「SSH鍵を追加」ボタンをクリックします。

MyKinstaの「SSH鍵を追加」
MyKinstaの「SSH鍵を追加」

モーダル/ポップアップウィンドウで、SSH鍵の「ラベル(名前)」を指定し、「SSH鍵」フィールドに公開鍵を貼り付け、「SSH鍵を追加する」をクリックして終了します。

MyKinstaでのSSH鍵の追加
MyKinstaでのSSH鍵の追加

GitLabにSSH秘密鍵を追加する

次に、サイトの本番環境にあるSSH秘密鍵をGitLabの環境変数として追加する必要があります。

秘密鍵を見つけるには、コマンドラインウィンドウに戻り、以下のコマンドを実行します。SSHの秘密鍵は、GitLab以外の場所で共有しないでください。

cat ~/.ssh/id_rsa

GitLabで、先ほど作成したプロジェクトをクリックします。サイドバーの「設定」にカーソルを合わせ、表示されるメニューから「CI/CD」をクリックします。

GitLabリポジトリのCI/CD設定
GitLabリポジトリのCI/CD設定

「変数」セクションまでスクロールし、「展開」ボタンをクリックし、「変数の追加」をクリックします。キー名に「SSH_PRIVATE_KEY」を使用し、「値」フィールドに秘密鍵を貼り付け、「変数の追加」ボタンをクリックして続行します。

変数を追加すると、リポジトリの設定に表示されます。

GitLabで利用可能なSSH秘密鍵
GitLabで利用可能なSSH秘密鍵

GitLabのリポジトリをMyKinstaにクローンする

必要なSSH鍵を追加したため、Kinstaの本番環境にGitLabのリポジトリをクローンできます。GitLabでリポジトリに移動し、青い「クローン」ボタンをクリックし、「SSHでクローン」の下の「URLをコピー」アイコンをクリックして、リポジトリのアドレスをコピーします。

GitLabのSSHでのクローン
GitLabのSSHでのクローン

コマンドラインウィンドウに戻り、本番環境のホームディレクトリに移動します。ホームディレクトリへの移動方法がわからない場合は、以下のコマンドを使用してください。

cd ~/

ホームディレクトリに移動したら、GitLabからコピーしたリポジトリアドレスを指定してgit cloneコマンドを実行します。

git clone [your-repository-url-here]

リポジトリをクローンすると、”you appear to cloned an empty repository”(空のリポジトリをクローンしている)という警告が表示されます。現時点でリポジトリは空ですので、これは予期された警告です。

GitLabリポジトリをKinsta本番環境にクローン
GitLabリポジトリをKinsta本番環境にクローン

KinstaのNginxの構成は、「~/public」フォルダからコンテンツを配信します。したがって、既存の「~/public」フォルダを削除し、クローンしたリポジトリフォルダの名前を「~/public」に変更する必要があります。これを行うには、以下の2つのコマンドを実行します。

rm -rf ~/public
mv ~/your-repo-folder-name ~/public

GitLabリポジトリの構成

次に、以下のコマンドで「~/public」フォルダに移動します。

cd ~/public

以下の2つのコマンドを実行して、GitLabリポジトリを設定します。このとき、必ず有効なメールアドレスと、GitLabアカウントに関連するユーザー名を指定してください。

git config --global user.email "[email protected]"
git config --global user.name "brian"

WP-CLIを使用してWordPressをインストールする

GitLabリポジトリをKinstaの本番環境にクローンし、設定できたので、WordPressをインストールします。WordPressはwordpress.orgからダウンロードして手動でもインストールできますし、WP-CLIでもインストールできます。今回の例では、WP-CLIを使用して、「~/public」フォルダに以下のコマンドでWordPressをインストールします。

wp core download

WordPressをインストールすると、「~/public」フォルダは以下のようになります。

新規WordPressインストールのWordPressコアファイルとディレクトリ
新規WordPressインストールのWordPressコアファイルとディレクトリ

次に、MyKinstaのサイトの「ドメイン」ページに移動し、「URLを開く」リンクをクリックして、プライマリドメインにアクセスします。

URLを開く
URLを開く

WordPressの5分間インストールの手順が表示されます。WordPressの設定に自信のない方は、こちらに詳細な記事があります。

新しいWordPressサイトの構成
新しいWordPressサイトの構成

WordPressのインストール完了後、プライマリドメインにアクセスすると、新しいWordPressサイトが表示されます。

新しいWordPressサイト
新しいWordPressサイト

GitLab CI/CDパイプラインの構成

次に、構成ファイルを設定して、リポジトリのメインブランチが更新されたら、自動デプロイを開始するようにGitLabに指示します。これには、Kinstaの本番環境の「~/public」フォルダにいることを確認し(必要ならcd ~/publicを実行して移動します)、以下のコマンドを実行して、新しいファイル「.gitlab-ci.yml」作成します。

touch .gitlab-ci.yml

ファイルを作成したら、以下のテキストをファイルに追加します。コマンドラインで「nano」や「vim」を使用してファイルを編集するか、SFTPとテキストエディタやコードエディタを使用して編集できます。SFTPクライアントを使用する場合は、「.gitlab-ci.yml」ファイルが見えるように隠しファイルの表示を有効化してください。

before_script:
    - apt-get update -qq
    - apt-get install -qq git
    # Setup SSH deploy keys
    - 'which ssh-agent || ( apt-get install -qq openssh-client )'
    - eval $(ssh-agent -s)
    - ssh-add <(echo "$SSH_PRIVATE_KEY")
    - mkdir -p ~/.ssh- '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking none" > ~/.ssh/config'
    - ssh-keyscan gitlab.com >> ~/.ssh/known_hosts
    - chmod 644 ~/.ssh/known_hosts
deploy_live:
    environment:
        name: Live
        url: your-primary-domain
    script:
        - ssh user@ip-address -p port-number "cd public-root && git checkout main && git pull origin main && exit"
    only:
        - main

deploy_liveブロックのurlscriptパラメータを変更します。太字の値は、MyKinstaで表示されるサイトの詳細に置き換えます。

  • your-primary-domain」を、サイトのプライマリドメインで置換する
  • ssh user@ip-address -p port-number」を、MyKinstaの「WordPressサイト」>「(サイト名)」>「情報」>「SFTP/SSH」で表示される「SSHターミナルのコマンド」で置換する
  • public-root」を、MyKinstaの「WordPressサイト」>「(サイト名)」>「情報」>「環境情報」で表示される「パス」で置換する
MyKinstaの公開パスとSSH詳細
MyKinstaの公開パスとSSH詳細

ファイルの「only: - main」セクションは、GitLabのCI/CDプロセスを起動するリポジトリブランチを参照します。この構成では、「main」ブランチにプッシュすると、Kinstaの本番環境へのデプロイが始まります。デプロイのトリガーとして別のブランチを指定する場合は、自由に設定を変更してください。

ステージング環境を考慮した追加の構成を実装するには、Kinstaのステージング環境のURLとSSHの詳細を使用して、追加の「deploy_staging」ブロックを構成します。

deploy_staging:
    environment:
        name: Staging
        url: your-staging-domain
    script:
        - ssh user@ip-address -p port-number "cd public-root && git checkout main && git pull origin staging && exit"
    only:
        - staging

同様に「only: - staging」セクションに注意してください。これは、「staging」ブランチにプッシュするとGitLabのCI/CDプロセスが始まることを意味します。必要に応じてこれを調整すると、好きなブランチからデプロイできます。

GitLabへの最初のコミット

これでWordPressとGitLabの設定ファイルが準備できました。GitLabに最初のコミットを実行してみましょう。新しいブランチ「v0.1」を作成し、リポジトリのファイルの追跡を開始し、変更をコミットして、「v0.1」ブランチのGitLabに変更をプッシュします。「~/public」から以下のコマンドを 実行して、最初のコミットを始めます。

git checkout -b v0.1
git add .
git commit -a -m 'Initial Commit'
git push origin v0.1

GitLabでリポジトリを確認すると、最初のコミットで作成したファイルが表示されるはずです。

GitLabへの最初のコミット
GitLabへの最初のコミット

Kinstaのステージング環境の構成

次に、MyKinstaのステージング環境を作成し、構成します。これで、本番環境に影響を与えずに、新しいプラグイン、テーマ、コードをテストする安全な場所を確保できます。

新規ステージング環境を作成
新規ステージング環境を作成

ステージング環境を作成したら、本番環境用のコマンドラインウィンドウは開いたまま、新しいコマンドラインウィンドウを開いてステージング環境にSSH接続し、以下のコマンドを実行して、コードの変更箇所を確認します。

cd ~/public && git status

以下のようなメッセージが表示されるはずです。ブランチは先ほど作成した「v0.1」ですが、加えて「wp-config.php」ファイルが変更されています。これはKinstaがステージング環境を作成する際に、「wp-config.php」に数行追加したためです。

Kinstaのステージング環境で変更されたファイル
Kinstaのステージング環境で変更されたファイル

変更をコミットし、本番環境にデプロイ

最後に、ステージング環境にいくつか変更を加え、GitLabを使用してKinstaの本番環境に新しいコミットをプッシュしてみます。なおこの方法は、Kinstaの「本番環境への反映」機能をバイパスする点に注意してください。

ここでは、次のWP-CLIコマンドを使用して、Yoast SEOプラグインをインストールします。

wp plugin install wordpress-seo

Yoast SEOプラグインをインストールしたら、以下のコマンドを実行してコミットし、「v0.1」ブランチに変更をプッシュします。

git add .
git commit -a -m ‘Installed Yoast SEO plugin.’
git push origin v0.1

最後に以下のコマンドで、「main」ブランチに切り替え、「v0.1」を「main」にマージし、「main」をGitLabにプッシュします。GitLab構成ファイルの「only: - main」の設定により、Kinstaの本番環境へのデプロイ処理が始まります。

git checkout main
git merge v0.1
git push origin main

GitLabで、レポジトリのサイドバーの「CI/CD」>「ジョブ」に移動すると、稼働中のジョブが表示されます。このジョブは、GitLabがKinstaの本番環境にYoast SEOプラグインをデプロイしているものです。

GitLabの稼働中のジョブ
GitLabの稼働中のジョブ

ジョブが終了したら、本番環境のコマンドラインウィンドウに戻り、そのウィンドウで「wp plugin list」を実行してください。リストには「wordpress-seo」が表示されます。これは、先にステージング環境にインストールされたYoast SEOプラグインです。

GitLab経由でYoast SEOプラグインがデプロイされた
GitLab経由でYoast SEOプラグインがデプロイされた

Kinstaのサイトを使用するテーマ開発者、プラグイン開発者は、GitLab CI/CDの自動デプロイを設定することでワークフローをスピードアップし、同時にコードのバージョン管理を行うことができます。