こんにちは。この記事では、GitLabとDocker上のJenkinsを使って、git pushのたびにロリポップのWebサーバへ自動デプロイする仕組みを構築したので、その手順をまとめます。
ローカルJenkinsにWebhookを通すために ngrok を活用している点がポイントです。

なお始めた背景には、CI/CDに興味があったということがあります。
実際自分がアサインされた案件において、projectのbuildやreleaseに組み込まれていました。裏側の仕組みが気になっていたため構築してみることにしたという経緯です！

全体構成

  [local PC(Windows)]
        │
        │ git push
        ▼
  ┌────────────┐
  │   GitLab   │
  └────────────┘
        │
        │ Webhook発火(Jenkinsへ通知)
        ▼
  ┌───────────────────┐
  │ ngrok(トンネル作成)│
  └───────────────────┘
        │
        │ （一時的な公開URLを発行）
        ▼
  ┌─────────────────────────────────┐
  │ Jenkins (Docker localhost:8080) │
  └─────────────────────────────────┘
        │
        │ build＆deploy
        ▼
  ┌────────────────────┐
  │ lolipop(Webserver) │
  │ (FTP)              │
  └────────────────────┘

🛠️ 環境概要

項目	内容
ローカル環境	Windows
Gitホスティング	GitLab（gitlab.com）
CI/CDツール	Jenkins（Dockerコンテナで起動）
外部公開	ngrokでJenkinsのポートを一時的に外部公開
Webサーバ	ロリポップ（FTPアップロード）

🐳 JenkinsをDockerで起動

docker run -d \
  --name jenkins \
  -p 8080:8080 -p 50000:50000 \
  -v jenkins_home:/var/jenkins_home \
  jenkins/jenkins:lts

ngrokで外部公開

GitLabのWebhookがローカルJenkinsに届くように、ngrokで外部トンネルを張ります：

ngrok http 8080

表示されたURL（例：https://abcd1234.ngrok.io）をGitLabのWebhookに設定します。
無料プランではこのURLは毎回変わります（固定URLは有料プラン限定）。

GitLab Webhook設定

GitLab > [Your Repo] > Settings > Webhooks：

URL： https://xxxx.ngrok.io/job/<ジョブ名>/build?token=YOUR_TOKEN
Trigger： Push events ✅

Jenkins側は「リモートビルドの許可」をONにし、トークンを設定しました。

Jenkinsジョブ内容（FTPアップロード）

#!/bin/bash
echo "Deploy start"

lftp -u ユーザー名,パスワード ftp://ftp.lolipop.jp <<EOF
cd public_html
mirror -R ./dist ./
bye
EOF

動作確認手順

ngrok http 8080 でJenkinsを外部公開
git push でGitLabに変更を送信
GitLabのWebhookがngrok経由でJenkinsに通知
Jenkinsがジョブを実行し、webserver(今回はlolipop)にアップロード
Webサイトに反映されていれば成功！

🧩 注意点・補足

ngrok無料プランではURLが起動ごとに変わってしまいます。
　→ そのため、Webhookの更新が毎回必要。

🔚 まとめ

GitLab + Jenkins（Docker） + ngrok + ロリポップの構成で、簡易CI/CDの構築を経験できました。
→会社のCI/CDのフローがあまり理解できていなかったので、実際に手を動かして経験することで、Jenkinsの役割について改めて理解できました。
無料版だとngrokのURLが変わってしまうことは盲点でした。現状だと少し使いにくいので改良していきたいなと思いつつ、実際やってみたかったCI/CDまわりの理解はできたので一旦はよしとします。