AntigravityアプリをGitHub連携・Vercelで公開する全手順

✅ 前提条件・環境

  • GitHubアカウント作成済み
  • Vercelアカウント作成済み
  • Macの「ターミナル」が使用可能
  • Antigravity等で作成したNode.jsプロジェクト（package.jsonが存在すること）
  • 所要時間：約15分

手順1：ローカルプロジェクトの確認

Antigravityで開発したプロジェクトがローカル環境のどこにあるかを確認します。

ターミナルで以下のコマンドを実行してください。

pwd
ls
⚠️
注意：package.json というファイルが表示されない場合、正しいプロジェクトフォルダにいません。フォルダを移動してください。

現在のGit管理状況を確認します。

git status

「On branch main」などが表示されればGit管理済みです。「fatal: not a git repository」と表示された場合は、後述の手順で初期化を行います。

手順2：GitHubリポジトリの作成

GitHub上で新しいリポジトリ（保存場所）を作成します。

項目設定値・内容
Repository name任意のプロジェクト名
例：okita-guitar-next
Public / PrivatePrivate（推奨）
※一般公開したくない場合は必ずPrivateを選択
Initializeチェックなし
※既存のコードをアップロードするため、空の状態で作成します

作成後、表示されるURL（https://github.com/...git）をコピーして控えてください。

手順3：GitHubへプッシュ（アップロード）

ローカルのコードをGitHubへアップロードします。

3-1. プロジェクトフォルダへの移動

必ず作業対象のフォルダに移動してから実行してください。

cd "/Users/hiroshiogawa/Documents/ANTI/okita-guitar-next"

3-2. Git初期化とコミット

まだGit管理されていない場合（git statusでエラーが出た場合）のみ実行します。

git init
git add .
git commit -m "Initial commit"

3-3. リモート登録とプッシュ

先ほど控えたGitHubのURLを登録し、アップロードします。

git branch -M main
git remote add origin [GitHubリポジトリURL]
git push -u origin main
⚠️
注意：パスワード入力を求められた場合、GitHubのログインパスワードは使用できません。「Personal Access Token (PAT)」を発行して入力してください。

手順4：Vercelで公開URLを作成

GitHubにあるコードをVercelに連携し、Web上に公開します。

Vercelにログインし、「Add New Project」から「Import」を選択します。

項目設定値・内容
Git ProviderGitHub
Repository手順2で作成したリポジトリを選択し「Import」をクリック
Framework Preset自動判定（Next.jsなど）
※基本的には変更不要です

設定を確認し、「Deploy」ボタンをクリックします。完了すると、https://[project-name].vercel.app という公開URLが発行されます。

手順5：更新作業とトラブルシューティング

コードを修正した場合、GitHubへプッシュするだけでVercelも自動的に更新されます。

更新コマンド（定型文）

cd "/Users/hiroshiogawa/Documents/ANTI/okita-guitar-next"
git status
git add .
git commit -m "Update"
git push

よくあるエラーと対策

エラーメッセージ原因と対策
fatal: not a git repository現在のフォルダが間違っています。
pwdで場所を確認し、正しいプロジェクトフォルダへcdしてください。
permission deniedフォルダへのパス指定が間違っています。
必ずcdコマンドの後にスペースを空けてパスを入力してください。

作業は以上です。

公開URLを確認し、アプリが正しく動作することを確認してください。

上部へスクロール