GitHub連携ガイド

ステップ1: Gitのインストール

Gitがインストールされているか確認：

git --version

インストールされていない場合：

• Windows: https://git-scm.com/ からインストーラーをダウンロード
• Mac: Homebrewで brew install git
• Linux: sudo apt-get install git (Ubuntu/Debian)

ステップ2: Gitの初期設定

ユーザー情報を設定：

git config --global user.name "あなたの名前"
git config --global user.email "your-email@example.com"

ステップ3: SSH鍵の生成と登録

SSH鍵を生成（既に持っている場合はスキップ）：

ssh-keygen -t ed25519 -C "your-email@example.com"
# Enterを3回押して、デフォルト設定で生成

公開鍵をコピー：

# Mac/Linux
cat ~/.ssh/id_ed25519.pub

# Windows (Git Bash)
cat ~/.ssh/id_ed25519.pub | clip

GitHubに登録：

1. GitHub → Settings → SSH and GPG keys
2. 「New SSH key」をクリック
3. Titleに任意の名前、Keyにコピーした公開鍵を貼り付け
4. 「Add SSH key」をクリック

ステップ4: リポジトリのクローン

AsamiWorksから提供されたリポジトリをクローン：

git clone git@github.com:asamiworks/your-project.git
cd your-project

基本的なワークフロー

1. 最新の変更を取得

   git pull origin main

2. 作業ブランチを作成

   git checkout -b feature/new-feature
   # ブランチ名の例: feature/add-contact-form, fix/header-bug

3. ファイルを編集

   お好きなエディタで編集してください

4. 変更をステージング

   git add .                    # すべてのファイル
   git add path/to/file.tsx    # 特定のファイル

5. コミット

   git commit -m "feat: お問い合わせフォームを追加"
   
   # コミットメッセージの例:
   # feat: 新機能追加
   # fix: バグ修正
   # docs: ドキュメント更新
   # style: スタイル変更
   # refactor: リファクタリング
   # test: テスト追加
   # chore: ビルド・設定変更

6. リモートにプッシュ

   git push origin feature/new-feature

7. プルリクエストを作成

   GitHubでプルリクエストを作成し、レビューを依頼

8. マージ後、ブランチを削除

   git checkout main
   git pull origin main
   git branch -d feature/new-feature  # ローカルブランチ削除

変更を確認するコマンド

git status              # 変更されたファイルを確認
git diff                # 差分を確認
git log                 # コミット履歴を確認
git log --oneline       # 簡潔な履歴表示
git log --graph --all   # ブランチツリー表示

ブランチ作成例

# 新機能開発
git checkout develop
git checkout -b feature/add-payment-system

# バグ修正
git checkout develop
git checkout -b fix/contact-form-validation

# 緊急修正（本番環境）
git checkout main
git checkout -b hotfix/security-patch

ステップ1: Vercelアカウント連携

1. VercelにGitHubアカウントでログイン
2. 「New Project」をクリック
3. GitHubリポジトリを選択
4. フレームワーク（Next.js等）を自動検出
5. 「Deploy」をクリック

これだけで、mainブランチへのプッシュで自動デプロイされます。

自動デプロイ設定

1. NetlifyにGitHubアカウントでログイン
2. 「New site from Git」をクリック
3. GitHubリポジトリを選択
4. ビルドコマンドと公開ディレクトリを設定
5. 「Deploy site」をクリック

.github/workflows/deploy.ymlの例

name: Deploy to Production

on:
  push:
    branches: [main]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '18'

      - name: Install dependencies
        run: npm ci

      - name: Build
        run: npm run build

      - name: Deploy to server
        uses: easingthemes/ssh-deploy@main
        with:
          SSH_PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }}
          REMOTE_HOST: ${{ secrets.REMOTE_HOST }}
          REMOTE_USER: ${{ secrets.REMOTE_USER }}
          SOURCE: "dist/"
          TARGET: "/var/www/html/"

1. 作業ブランチをプッシュ
2. GitHubリポジトリページで「Pull request」をクリック
3. タイトルと説明を記入：
   • 何を変更したか
   • なぜ変更したか
   • 動作確認方法
   • スクリーンショット（必要に応じて）
4. レビュワーを指定
5. 「Create pull request」をクリック

コンフリクトが発生した場合

# 最新のmainブランチを取得
git checkout main
git pull origin main

# 作業ブランチに移動してマージ
git checkout feature/your-branch
git merge main

# コンフリクトを解消（エディタで編集）
# <<<<<<<, =======, >>>>>>> のマーカーを削除し、正しいコードを残す

# 解消後、コミット
git add .
git commit -m "fix: mainとのコンフリクトを解消"
git push origin feature/your-branch