【第5回・完結】世界に公開する 〜GitHub と Vercel でデプロイ編〜

ついにゴール

全5回の最終回。作ったホームページをインターネットに公開します。

ここまで来ると、本当にスマホ1台で「開発 → 公開」が完結します。PCを開くことは一度もなかった。ちょっと感動ものです。

公開までの流れ

順番はこう。

スマホの中のコード
     ↓ (Gitでアップロード)
   GitHub
     ↓ (自動連携)
   Vercel ← ここが公開してくれる
     ↓
  世界に公開!

GitHubはコードを保存しておく倉庫、Vercelはその倉庫を見て自動でホームページとして公開してくれるサービス、という役割分担です。どっちも無料で使えます。

GitHubにアップロードする

アカウントと空のリポジトリを用意

スマホのブラウザでGitHubにログインして、「New repository」から空のリポジトリを作ります。名前は myhp あたりで。この時点では中身は空っぽでOK。

Personal Access Token(PAT)を作る

スマホからGitHubにアップロードするには、パスワードの代わりにトークンが必要です。

GitHubの「Settings → Developer settings → Personal access tokens → Tokens (classic)」から新規作成。スコープ(権限)は repo にチェックを入れればとりあえずOKです。

表示されたトークンはその瞬間しか見られないので、必ずメモ帳などにコピーしておきます。

コードをプッシュ

Claude Codeに頼みます。

このプロジェクトをGitHubにプッシュしたい。
リポジトリURLは https://github.com/ユーザー名/myhp.git

裏側で動くコマンドはこんな感じ。

git init
git add .
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/ユーザー名/myhp.git
git push -u origin main

途中でユーザー名とパスワードを聞かれたら、ユーザー名はGitHubのID、パスワードにはさっきのPATを貼り付けます。GitHubのログインパスワードではないので注意。

Vercelでデプロイする

アカウント作成

Vercelの公式サイト(vercel.com)でアカウントを作ります。GitHubアカウントでそのままサインアップするのが一番早いです。

プロジェクトを繋ぐ

ダッシュボードの「Add New → Project」から、さっき作った myhp リポジトリを選択。

フレームワークは自動で「Next.js」と判定されるはず。特に設定を変えずに Deploy ボタンを押すだけ。

1〜2分待つと……

https://myhp-xxxx.vercel.app みたいなURLが発行されて、ホームページがインターネットに公開されます。

試しにそのURLを別のスマホや友達に送ってみてください。ちゃんと見えるはず。感動ポイントです。

これからの更新の仕方

一度この仕組みを作ってしまえば、更新は超シンプル。

  1. Claude Codeに「ここをこう直して」と指示
  2. git add . && git commit -m "更新" && git push(これもClaudeに任せていい)
  3. Vercelが自動で検知して再デプロイ

つまり GitHubにpushするだけで、勝手に公開サイトが更新される。こんなことが、スマホ1台で完結します。

つまずきポイント

  • push時に認証失敗: 99%はPATのスコープ不足か、パスワード欄にトークンじゃなくてGitHubのパスワードを入れてるケース
  • Vercelでビルドが失敗: 大抵は npm run build をローカル(スマホ内)で先に通しておくと防げる。エラー全文をClaudeに食わせれば原因が出てくる
  • 独自ドメインを使いたい: Vercelのダッシュボードから数クリックで設定できます。お名前.comなどで取ったドメインをDNS設定で向ければOK

シリーズを終えて

5回にわたって、Android スマホ1台でホームページを公開するまでの手順を追いかけました。

昔は「開発にはPCが必要」が常識でした。でも今は、スマホの中にLinuxを立てて、AIを相棒にして、世界に向けて情報発信まで全部できる時代です。

何より大事なのは、「完璧なPCが揃うまで待つ」必要がないということ。手の中のスマホで今すぐ始められる。これは結構すごいことだと思っています。

このシリーズが、誰かの「やってみようかな」のきっかけになったら嬉しいです。

完。