はじめに
個人開発で、Next.js + Supabase + Netlify の構成で学習アプリを作っています。
最近はChatGPTを使って、仕様書の作成、画面追加、CSV設計、DB設計などをかなり進めています。
その中で、少しヒヤッとしたことがありました。
それが、
ChatGPTにGitHub上のファイルを直接編集させていたら、Netlifyの自動デプロイが毎回走っていたかもしれない
という話です。
何が起きたか
開発中のアプリでは、GitHubリポジトリとNetlifyを連携しています。
通常は、
GitHubにpush
↓
Netlifyが自動ビルド
↓
デプロイ
という流れです。
これは便利なのですが、ChatGPTにGitHubコネクタ経由でファイル編集を依頼していたため、ChatGPTがファイルを作成・更新するたびにGitHubへコミットされていました。
例えば、次のような作業です。
- docs の仕様書を更新
- 画面設計.md を更新
- DB設計.md を更新
- src/app/sg/page.tsx を作成
- src/app/sg/practice/page.tsx を作成
- src/app/sg/result/page.tsx を作成
- import script を追加
この時点では、私は「ChatGPTがGitHubを編集してくれて便利だな」くらいに思っていました。
でも後から気づきました。
GitHubにコミットされるということは、Netlifyの自動デプロイが有効なら、そのたびにビルドが走る可能性がある。
つまり、まだ動作確認もしていない途中の変更で、Netlifyのビルド時間やクレジットを消費していたかもしれません。
何が問題だったか
問題は、ChatGPTを使ったことではありません。
問題だったのは、
作業途中の小さな変更
↓
そのままGitHubへコミット
↓
Netlifyが自動ビルド
という流れを意識していなかったことです。
特に個人開発では、以下のような作業が多いです。
- 仕様書を少し直す
- READMEを少し直す
- 画面を仮で作る
- DB設計を試しに変更する
- CSV設計を調整する
こうした作業は、ローカルでまとめて確認してからpushすれば十分です。
それなのに、1ファイル変更するたびにNetlifyが反応していたら、かなりもったいないです。
ChatGPT作業そのものではNetlifyクレジットは消費しない
整理すると、ChatGPTで相談したり、コードを書いてもらったりするだけではNetlifyのクレジットは消費しません。
消費される可能性があるのは、次の流れです。
ChatGPTがGitHubに直接コミット
↓
GitHubリポジトリが更新される
↓
Netlifyの自動デプロイが起動
↓
Netlify上でビルドが走る
つまり、原因はChatGPTではなく、GitHub連携とNetlify自動デプロイの組み合わせです。
今後の運用を変えることにした
今回の反省から、今後は以下の運用に変えることにしました。
1. ChatGPTにはGitHubを直接編集させない
2. ローカルの作業ディレクトリを前提にする
3. ChatGPTには差分や完成コードだけ出してもらう
4. 自分のPCでファイルを編集する
5. npm run lint を実行する
6. npm run build を実行する
7. 問題なければ git commit
8. 公開したいタイミングで git push
ローカルの作業場所は以下です。
/Users/ユーザー名/Documents/GitHub/プロジェクト名
この流れにすれば、ChatGPTとの作業中にNetlifyが勝手に動くことはありません。
npm run lint と npm run build を先にやる
今後はpush前に、最低限この2つを実行します。
npm run lint
npm run build
npm run lint は、コードの書き方やルール違反をチェックするためのコマンドです。
npm run build は、Next.jsアプリが本番用にビルドできるか確認するためのコマンドです。
ローカルでこれを実行しても、Netlifyのクレジットは消費しません。
ローカルで npm run build
→ 自分のPCでビルド確認
→ Netlifyクレジットは使わない
一方で、GitHubにpushするとNetlify側でビルドが走る可能性があります。
git push
→ Netlifyが自動ビルド
→ Netlifyクレジットを使う可能性あり
なので、push前にローカルで確認するのが大事です。
Netlify側で確認する場所
実際にビルドが走っていたか確認するには、Netlifyの管理画面で確認します。
Netlify
↓
対象サイト
↓
Deploys
ここに、GitHubコミットのタイミングでdeployが並んでいたら、自動ビルドが動いていた可能性があります。
対策
今後の対策は以下です。
1. ChatGPTにGitHubを直接編集させない
ChatGPTには、ローカルで貼り付けられるコードや差分を出してもらうだけにします。
2. 作業途中はpushしない
ドキュメント修正や仮実装の段階では、Netlifyにデプロイする必要はありません。
3. ローカルで確認してからpushする
npm run lint
npm run build
この2つが通ってからpushします。
4. 必要ならNetlifyの自動デプロイを止める
頻繁に作業する時期は、Netlifyの自動デプロイ設定を見直すのもありです。
学び
今回の学びはシンプルです。
AI開発は速いけど、CI/CDも一緒に速く動いてしまう。
ChatGPTに作業を任せると、仕様書やコードの変更がどんどん進みます。
でも、GitHubとNetlifyを連携している場合、その変更がそのままデプロイフローに乗ってしまうことがあります。
AIで開発速度が上がるほど、以下のような運用ルールが大事になると感じました。
- どこまでをAIに任せるか
- いつGitHubに反映するか
- いつNetlifyにデプロイするか
- ローカル確認をどこで挟むか
まとめ
ChatGPTにGitHub編集を任せるのは便利です。
ただし、Netlifyなどの自動デプロイと連携している場合は注意が必要です。
今回の結論はこれです。
ChatGPTで作業する
↓
ローカルで確認する
↓
lint/buildする
↓
問題なければcommit
↓
公開したいタイミングでpush
個人開発では無料枠やクレジットを大事に使いたいので、今後はこの流れで進めていきます。