Attention: This page is 137 days older than the English version and might be outdated. If you're a native speaker of this language and would like to contribute to the project, please consider updating this page to match the latest English version.
You can also view the English version of this page.
はじめの一歩
新しい T3 アプリのために初期構成を生成し、準備ができたとして、ここではアプリを動作させるために必要な最低限の手順を説明します。
データベース
アプリケーションに Prisma を含めた場合には、アプリケーションのルートディレクトリからnpx prisma db push
を実行してください。このコマンドは Prisma スキーマをデータベースと同期させ、スキーマに基づいて Prisma クライアントの TypeScript 型を生成します。なお、このコマンドを実行した後、生成された型を検出できるように TypeScript サーバーを再起動する↗ 必要があることに注意して下さい。
認証
アプリケーションに NextAuth.js を含めた場合、まずDiscordProvider
から始めます。これは NextAuth.js が提供するプロバイダの中で最もシンプルなものの一つですが、初期設定が少し必要です。
もちろん、別の認証プロバイダを使いたい場合は、NextAuth.js が提供する多数のプロバイダ↗から選んで利用することができます。
-
Discord のアカウントが必要になりますので、まだの方は登録してください。
-
https://discord.com/developers/applications↗ に移動し、右上の「New Application」をクリックします。アプリケーションの名前を付け、利用規約に同意してください。
-
アプリケーションの作成が完了したら、「Settings → OAuth2 → General」に移動してください。
-
「Client ID」をコピーし、
DISCORD_CLIENT_ID
として.env
に追加します。 -
「Reset Secret」をクリックし、新しいシークレット情報をコピーし、
DISCORD_CLIENT_SECRET
として.env
に追加します。 -
「Add Redirect」をクリックし、
http://localhost:3000/api/auth/callback/discord
と入力します。- 本番環境でのデプロイの場合は、前述の手順で別の Discord アプリケーションを作成しますが、今回は
http://localhost:3000
をデプロイ先の URL で置き換えてください。
- 本番環境でのデプロイの場合は、前述の手順で別の Discord アプリケーションを作成しますが、今回は
-
変更を保存します。
-
.env
にNEXTAUTH_SECRET
を設定します。開発環境では任意の文字列が機能しますが、本番環境では.env
内のセキュアなシークレット情報の生成に関する注意事項を参照してください。
これでログインできるようになります。
エディターの設定
開発者体験を最適にするために、以下の拡張機能を推奨します。以下のリンクは、それぞれのエディター用のプラグインサポートを提供します。