> ## Documentation Index
> Fetch the complete documentation index at: https://supastack.dev/llms.txt
> Use this file to discover all available pages before exploring further.
> For the full documentation corpus in one file, fetch: https://supastack.dev/llms-full.txt

# GitHub サインインを追加

環境ごとに GitHub OAuth アプリを作成し、「GitHub で続行」をアプリに組み込みます。

## 初心者向けのウォークスルー

前提条件:ローカルで動作する Web アプリと、実アカウント用の移行済みデータベース。GitHub アカウントが必要です——リポジトリを所有しているものと同じアカウントで構いません。無料で、環境あたり約 5 分です。

用語メモ:GitHub OAuth アプリは、GitHub があなたの代わりにユーザーをサインインさせるための登録です。ほとんどのプロバイダーと異なり、1 つの OAuth アプリは Authorization callback URL(認証コールバック URL)をちょうど 1 つしか許可しません——そのためローカル(`http://localhost:3000/…`)と本番(`https://yourdomain.com/…`)にはそれぞれ独自のアプリが必要です。1 つのアプリを使い回してコールバックを行き来させると、毎回どちらか一方が壊れます。

1. アカウントの Developer settings(開発者設定)でローカル用 OAuth アプリを作成します。2. Client ID(クライアント ID)をコピーし、Client Secret(クライアントシークレット)を生成します。3. 3 つの環境変数を設定して再起動します。4. 公開前に実際のドメインでもう一度繰り返します。

[Web アプリを 5 分で公開](https://supastack.dev/ja/docs/web/ship-in-5-minutes.md)

[データベースのセットアップ](https://supastack.dev/ja/docs/web/setup-database.md)


## ローカル用 OAuth アプリを作成する

1. [github.com](https://github.com) を開いてサインインします。右上のプロフィール写真をクリック → Settings(設定)。

2. 左サイドバーの一番下までスクロールし、Developer settings → OAuth Apps → New OAuth App(開発者設定 → OAuth アプリ → 新しい OAuth アプリ)を開きます。

3. Application name(アプリケーション名):`supastack local` のような名前——この名前が GitHub の認証ページでユーザーに表示されます。Homepage URL(ホームページ URL):`http://localhost:3000`。Authorization callback URL(認証コールバック URL):`http://localhost:3000/api/auth/callback/github`。Register application(アプリケーションを登録)をクリックします。

4. アプリのページで Client ID(クライアント ID)をコピーし、Generate a new client secret(新しいクライアントシークレットを生成)をクリックして、シークレットをすぐにコピーします——GitHub は一度しか表示しませんが、いつでも別のものを生成できます。


## 本番用 OAuth アプリを作成する

製品名、Homepage URL `https://yourdomain.com`、Authorization callback URL `https://yourdomain.com/api/auth/callback/github` で、同じ New OAuth App の手順を繰り返します。

各アプリの認証情報はそれぞれの環境に保管してください。ローカルアプリのペアは `apps/web/.env.local` に、本番アプリのペアはホストのシークレットストアに置きます。ローカルのシークレットが本番設定に入り込んではいけません。その逆も同様です。


## 値をアプリに追加する

ローカルアプリの認証情報を使って、`apps/web/.env.local` に以下の 3 行を設定します。`AUTH_GITHUB_ENABLED=true` がボタンを有効にし、このペアが OAuth アプリを識別します。

クライアントシークレットはサーバー専用のままです——`NEXT_PUBLIC_`/`EXPO_PUBLIC_` 変数には入れず、コミットもしません。編集後は開発サーバーを再起動してください。

他で見かけるかもしれない `GITHUB_APP_*` の値は再利用しないでください——それらはユーザーサインインではなく、無関係の GitHub App 統合のものです。キットの `docs/github-auth-setup.md` が、このフロー全体を端から端まで案内する別の参考資料になります。

```
# apps/web/.env.local — from the LOCAL OAuth App
AUTH_GITHUB_ENABLED=true
GITHUB_CLIENT_ID=your-oauth-app-client-id
GITHUB_CLIENT_SECRET=your-oauth-app-secret
```


## 確認とトラブルシューティング

http://localhost:3000/auth を開き、GitHub ボタンをクリックします。github.com でアプリを認証し、サインイン状態で戻ってくることを確認します。

`AUTH_GITHUB_ENABLED=true` を設定するまで、`/auth` の GitHub オプションは表示されたまま無効です——env ファイルの名前を確認してから再起動してください。`GITHUB_CLIENT_ID` と `GITHUB_CLIENT_SECRET` の両方なしにフラグを設定すると起動が失敗し、不足している変数が指摘されます。

コールバックの不一致がよくある失敗です。アプリの Authorization callback URL は `{APP_URL}/api/auth/callback/github` と正確に一致する必要があります——プロトコル、ホスト、ポート、パスのすべて。デプロイ後の `redirect_uri` エラーは通常、APP_URL が本番を示しているのにリクエストがローカルアプリの認証情報に当たったか、その逆を意味します。

env を編集するたびに開発サーバーを再起動してください。値は起動時にのみ読み込まれます。

[次にデータベースをセットアップ](https://supastack.dev/ja/docs/web/setup-database.md)

[OAuth プロバイダーの概要](https://supastack.dev/ja/docs/web/setup-oauth.md)


設定を続けるには、[Apple サインインを追加](https://supastack.dev/ja/docs/web/apple-sign-in.md)をご覧ください。


## 次へ

[Apple サインインを追加](https://supastack.dev/ja/docs/web/apple-sign-in.md)