AI で作ったアプリを GitHub 連携で公開する

ZIP からデプロイする方法は、1 回公開するだけなら最短です。ただし直すたびに ZIP を作り直してアップロードする手間があります。GitHub 連携にしておくと、AI に「ここを直して push して」と頼むだけで hanamii が自動で再デプロイします。続けて育てるアプリには、こちらをおすすめします。

このページのプロンプトは、ターミナルや git を操作できる AI コーディングツール（Claude Code、Codex、Cursor、GitHub Copilot のエージェント、Gemini CLI など）向けです。ブラウザのチャットだけで使う ChatGPT や Claude の場合は、ページ末尾の「git を使わずに GitHub に置く」を使ってください。技術条件の正本は ZIP の場合と同じ機械可読ページ https://hanamii.jp/ai/zip-deploy.txt で、プロンプトが AI にこれを読ませます（2026年10月時点）。

全体の流れ

1. AI にアプリを作らせ、GitHub の新しいリポジトリに push させる（このページのプロンプト）
2. hanamii でそのリポジトリを選んでデプロイする（初回だけ・3 分ほど）
3. 以降は AI に「直して push して」と頼むだけで、公開 URL が自動で更新される

GitHub 連携は ZIP アップロードと違って事前の検証がありません。構成に問題があるとビルドの段階で止まるので、プロンプトでは「push する前に手元で起動を確認する」ことを AI に求めています。

ステップ 1: コピペ用プロンプト（生成から push まで 1 回で）

「作るもの」の行を書き換えて、AI コーディングツールにそのまま貼り付けてください。新しい空のフォルダで始めるときのプロンプトです。

hanamii（https://hanamii.jp）に GitHub 連携で公開できる Web アプリを作り、GitHub に push するところまでお願いします。

【作るもの】
（ここに作りたいアプリの内容を書く。例: 日報を投稿して一覧で見られるアプリ）

【手順】
1. まず https://hanamii.jp/ai/zip-deploy.txt を読み、そこに書かれた技術条件に従うこと。
   ただし ZIP は作らない（「ZIP の梱包仕様」と ZIP 化の指示は読み飛ばしてよい）
2. Next.js（App Router）のプロジェクト一式を作ること。package.json はリポジトリの一番上に置き、
   scripts に "dev": "next dev" / "build": "next build" / "start": "next start" を必ず定義すること
3. .gitignore を作り、node_modules・.next・.env・.env.*・dist・build を除外すること
4. 手元で npm install → npm run build → npm start を実行し、ブラウザで開けることを確認すること
5. git リポジトリにして main ブランチにコミットし、GitHub に新しい非公開リポジトリを作って push すること。
   gh コマンドが使えるなら gh repo create を使う。使えなければ、GitHub でリポジトリを作る手順と
   push するコマンドを私に示して、実行を待つこと
6. push する前に、API キーなどの秘密情報がコードやコミット履歴に含まれていないことを確認すること

【最後に報告すること】
- リポジトリの URL とブランチ名
- hanamii の環境変数タブに登録が必要な変数の名前一覧（値は書かない。なければ「なし」と書く）
- 私が hanamii 側で行う操作（https://hanamii.jp/docs/guides/deploy-github の手順）を 3 行で

上記 1 の URL が読めない場合は、その旨をひとこと伝えたうえで、2〜6 に従って作ること。

すでに手元にあるアプリ（Express・Vite・Flask・Laravel など）を GitHub 連携で公開したいときは、次のプロンプトを使います。

このプロジェクトを hanamii（https://hanamii.jp）に GitHub 連携でデプロイできる構成に整えて、push してください。

1. まず https://hanamii.jp/ai/other-frameworks-deploy.txt を読み、該当するレシピに従って
   必要最小限の変更だけを加えること。アプリの機能は変えないこと
2. .gitignore に node_modules・.env・.env.*・ビルド成果物のフォルダが入っていることを確認すること
3. 手元で起動して PORT=8080 で HTTP の応答が返ることを確認してから、現在のブランチにコミットして push すること
4. 最後に、変えたファイルとその理由、hanamii の環境変数タブに登録が必要な変数の名前一覧（値は書かない）、
   package.json がリポジトリの一番上にない場合はルートディレクトリに指定するパスを報告すること

ツールごとの補足

• Claude Code / Codex CLI / Gemini CLI（手元のパソコンで動くもの）: 上のプロンプトだけで push まで完了します。GitHub への push に使う認証（gh auth login か git の資格情報）は、初回だけ AI が案内するので、画面の指示に従ってください
• Cursor / GitHub Copilot のエージェント: エディタのチャットに貼り付けます。ターミナル操作の許可を求められたら許可してください
• Claude Code のウェブ版や Codex のクラウド版: 手元のパソコンではなくクラウドで動き、結果を新しいブランチやプルリクエストとして返す形が基本です。その場合は、GitHub でプルリクエストを main にマージしてから hanamii に連携するか、hanamii 側でそのブランチをデプロイ対象に指定してください

ステップ 2: hanamii でリポジトリを選ぶ（初回だけ）

AI の報告にあるリポジトリ URL・ブランチ名・環境変数名を手元に置いて、GitHub からデプロイするの 3 ステップを進めます。

1. プロジェクト一覧の プロジェクトを作成 を押し、「GitHubからデプロイ」の リポジトリを選択 を押して、GitHubで認証 で hanamii の GitHub App をインストールします。アクセスを許可するリポジトリを選ぶ画面で、AI が作ったリポジトリを選んでください（非公開リポジトリでも構いません）
2. 一覧から AI が作ったリポジトリを選びます
3. 設定画面で次を確認して デプロイ開始 を押します

デプロイが始まると進捗画面に移り、完了すると公開 URL が発行されます。初回は数分かかります。

ステップ 3: 直したいときは「直して push して」

公開後は、同じ AI ツールに次のように頼むだけです。hanamii が push を検知して自動で再デプロイし、進捗はプロジェクト詳細の デプロイ タブで確認できます。

トップページの見出しを「今日の日報」に変えて、投稿に日付を表示してください。
直したら手元で npm run build が通ることを確認して、main に push してください。

新しく環境変数が必要になる変更（外部 API を使うなど）を頼んだときは、AI に「hanamii の環境変数タブに追加が必要な変数名を報告して」と添えてください。変数はプロジェクト詳細の 環境変数 タブから追加でき、反映には再デプロイが必要です。

デプロイが失敗したときは

結果画面の 全エラーをAI用にコピー ボタンでエラー内容をコピーし、同じ AI ツールに次のように貼り付けるのが最短です。直した内容が push されれば、再び自動でデプロイされます。

hanamii のデプロイが失敗しました。以下がエラーです。原因を直して、手元で npm run build と npm start が通ることを
確認してから、同じブランチに push してください。

（ここに「全エラーをAI用にコピー」の内容を貼る）

GitHub 連携でよくある失敗と原因は次のとおりです。

エラーの種類ごとの詳しい調べ方はトラブルシューティングにまとめています。

git を使わずに GitHub に置く（ブラウザだけで進める場合）

ChatGPT や Claude をブラウザのチャットだけで使っている場合、AI は GitHub に直接 push できません。その代わり、ChatGPT や Claude で作ったアプリを公開するのプロンプトで app.zip を作らせ、中身を GitHub のブラウザ画面からアップロードする方法があります。

1. app.zip をダウンロードして解凍する（package.json が直接入っているフォルダができます）
2. GitHub で New repository を押し、名前を付けて（非公開で構いません）Create repository を押す
3. 作成直後の画面にある uploading an existing file を押し、解凍したフォルダの中身（package.json や app フォルダなど）を画面にドラッグ＆ドロップする。フォルダごとドロップしても構いませんが、node_modules や .env は含めないでください
4. 画面下の Commit changes を押す

これでステップ 2 に進めます。更新するときは、AI に新しい app.zip を作らせて、リポジトリの Add file → Upload files から同じように上げ直すと、同じ名前のファイルが置き換わって自動デプロイが走ります。ブラウザからのアップロードは一度に 100 ファイルまで・1 ファイル 25 MiB までです（GitHub 公式ドキュメント、2026年10月時点）。生成直後の Next.js アプリなら通常 10〜20 ファイルなので収まります。

よくある質問

Q. リポジトリは非公開でも大丈夫ですか

はい。GitHub App のインストール時にアクセスを許可したリポジトリであれば、非公開でもデプロイできます。

Q. AI に GitHub の操作を任せて大丈夫ですか

プロンプトには「秘密情報が含まれていないことを確認する」と「非公開リポジトリにする」を入れています。API キーなどはコードに書かず、hanamii の環境変数タブに登録する運用にしてください。環境変数の設定も参照してください。

Q. ZIP と GitHub、どちらにすべきですか

一度公開して終わりなら ZIP、直しながら育てるなら GitHub 連携です。途中で切り替えることもできます（同じワークスペースに GitHub 連携で新しいプロジェクトを作り、古い ZIP のプロジェクトを削除します）。

関連ガイド

• Claude Code・Codex・Cursor から hanamii に公開する（エージェントに「hanamii にデプロイして」と頼むだけで公開する）