Claude CodeとGitを連携させてGitHubへ公開する
中級/commitでAIに任せてコミットし、GitHubにpushしてウェブサイトを公開します。
座学
この講座で学べること
- ✓/commitコマンドでコミットメッセージを自動生成してもらえることを理解する
- ✓ローカルリポジトリとリモートリポジトリ（GitHub）の概念の違いを把握する
- ✓git pushでGitHubにコードを送る手順を習得する
- ✓GitHub Pagesで無料でウェブサイトを公開する方法を知る
Claude Codeの `/commit` スラッシュコマンドを使うと、変更されたファイルを自動で検知してコミットメッセージを提案してくれます。提案されたメッセージを確認してEnterを押すだけでコミット完了です。手動では `git add → git commit -m "メッセージ"` と自分で入力する必要がありますが、/commitは変更の自動検知・メッセージ自動生成・確認のみという流れになります。Gitに慣れていない段階では特に便利で、メッセージが思い浮かばない・git addを忘れたといった失敗を防げます。
GitHubは世界最大のソースコード共有サービスです。Gitで管理している履歴をインターネット上に保存・共有できます。「ローカルリポジトリ」（手元のパソコンにある保存箱）と「リモートリポジトリ」（GitHub上にある保存箱）の2つを同期させるのが基本的な使い方で、`git push` で手元の変更をGitHubへ送ります。チームでの共同作業・バックアップ・コード公開のすべてにGitHubが使えます。
GitHub Pagesを使うと、GitHubにあるHTMLファイルを無料でウェブサイトとして公開できます。中級4・5で作ったindex.htmlをGitHubにpushすれば、世界中からアクセスできる自分のウェブサイトになります。独自ドメインなしで `https://あなたのユーザー名.github.io/リポジトリ名` というURLで公開され、設定は5分もあれば完了します。
GitHubへのpushには認証が必要です。初回は認証トークンの設定が必要になることがあります。GitHubで「Settings → Developer settings → Personal access tokens」からトークンを生成し、pushの際にパスワードとして使用します。Claude Codeに「GitHubにpushしようとしたら認証エラーが出ました」と伝えると、OS別の設定手順を案内してくれます。
/commit の仕組み
変更を自動検知
Claude Codeが変更ファイルを読む
メッセージを自動生成
変更内容からコミットメッセージを作成
あなたが確認
提案を確認してEnterで承認
コミット完了
セーブポイントが自動で作成される
git push の仕組み
ローカル（手元）
あなたのパソコン
クラウドに同期
GitHub（クラウド）
github.com/リポジトリ
GitHub Pages で公開する（任意）
GitHubリポジトリ
index.html を含むコード
ウェブサイトとして公開
https://あなた.github.io/リポジトリ名
誰でもアクセス可能に！
Settings → Pages → Branch: main → Save で無料公開できます
実践手順
ステップ1：Claude Codeでファイルを変更してから /commit を実行する
まず何かファイルを変更してもらいましょう。変更後に /commit を実行すると、Claude Codeが変更内容を確認してコミットメッセージを提案してくれます。
/commitステップ2：提案されたメッセージを確認してEnterを押す
Claude Codeが提案するコミットメッセージを確認してください。内容を確認してEnterを押すとコミットが完了します。メッセージを変えたい場合は修正してからEnterを押しましょう。
ステップ3：GitHubアカウントを作成する
以下のURLからGitHubのアカウントを作成してください。メールアドレスがあれば無料で作れます。すでにアカウントをお持ちの方はスキップしてください。
https://github.com/signupステップ4：新しいリポジトリを作成する
GitHubにログインして「New repository」をクリックします。Repository name に好きな名前を入力して「Create repository」を押してください。
https://github.com/newステップ5：リモートリポジトリを登録してpushする
GitHubで作成したリポジトリのURLを使って、以下の2つのコマンドを順番に実行してください。「your-username」をGitHubユーザー名、「your-repo」をリポジトリ名に変えてください。
git remote add origin https://github.com/your-username/your-repo.git
git push -u origin mainステップ6：GitHub Pages で公開する（任意）
index.html があるリポジトリなら無料でウェブサイトとして公開できます。GitHubのリポジトリページで「Settings → Pages」を開き、Branch を「main」に設定して「Save」を押してください。数分後にURLが生成されます。
確認チェック
講座を終える前に、以下の項目を確認しましょう。
よくある質問
Q. git pushしたら「rejected」と出てpushできません
A. GitHubのリポジトリにローカルにない変更がある場合に発生します。まず `git pull` を実行してGitHubの最新状態を取得してからpushしてください。一人で使っているリポジトリなら `git push --force` で強制pushもできますが、他の人と共有しているリポジトリでは使わないでください。
Q. GitHubにpushしたのにGitHub Pagesのページが更新されていません
A. GitHub Pagesの反映には数分かかることがあります。ブラウザのキャッシュも影響するため、強制リロード（Ctrl+Shift+R）も試してみてください。5分以上経っても反映されない場合は、Settings→Pagesでデプロイのステータスを確認してください。
Q. リポジトリをPublicにすると何が公開されますか？
A. コードファイルとgit commitの履歴（誰がいつどんな変更をしたか）が公開されます。APIキーやパスワードなどの秘密情報をコードに直接書いていた場合、それも公開されてしまいます。機密情報は `.env` ファイルに書いて `.gitignore` で除外する習慣をつけることが重要です。不安な場合はPrivateリポジトリで管理してください。