Summary  
This chapter demonstrates how to hash passwords using bcrypt before storage and configure a credentials provider in NextAuth middleware to authenticate users via username and password.  

General domain of usage  
User authentication

パスワードのハッシュ化は、データベースに保存する前の安全対策。パスワードを固定長のランダムに見える文字列へ変換し、ユーザーデータが漏洩した場合でもセキュリティを強化。

`seed.js` ファイルでは、`bcrypt` というパッケージを使用してユーザーのパスワードをデータベースに保存する前にハッシュ化。今後、`bcrypt` を使ってユーザーが入力したパスワードと保存済みのパスワードを比較。

## プロジェクトに戻る
Next.js の Middleware で `bcrypt` を使用するため、`auth.ts` という別ファイルを作成。ここに `authConfig` オブジェクトを含む。

### Credentials プロバイダー
NextAuth.js のプロバイダーは、Google や GitHub などの異なるログインオプションのようなもの。ユーザーに様々なログイン方法を提供。

`auth.ts` ファイルでは、`Credentials` というプロバイダーを追加。これにより、ユーザー名とパスワードでのログインが可能。

Next.jsを使用して、モダンで高性能なウェブアプリケーションの構築方法を学びます。構造化されたレイアウト、スタイリング、ルーティングによるシームレスなナビゲーションでプロジェクトをセットアップします。効率的なデータ取得と表示を行い、レンダリングとパフォーマンスを最適化します。ページネーション、CRUD操作、グローバル検索などの高度な機能を実装し、動的なウェブアプリを実現します。Next.jsプロジェクトのデプロイ、データベースとの接続、認証機能の追加によるユーザーデータの保護も扱います。

Next.jsフレームワークに取り組む前に学ぶべき内容、このコースで期待できること、そして構築するものについて説明します。

プロジェクトのセットアップを行い、アプリにスタイリングを追加する方法を確認し、画像、フォント、ページ、レイアウトなどのビジュアル面を扱います。

アプリの新しいビューを簡単に作成・管理し、組み込まれたルーティングシステムによってすべてのページをシームレスにナビゲートする方法を学びます。

GitHubおよびVercelアカウントを使用してNext.jsアプリをデプロイします。さらに、アプリに必要なデータを提供するためのデータベースを構築します。

データを明確かつ効率的に取得し、ユーザーに表示する方法を検討します。

ページネーション、CRUD操作、グローバル検索、フォームバリデーションなどの最新ウェブ機能の実装方法を学びます。

パスワードのハッシュ化と認証情報の管理

プロジェクトに戻る

Credentials プロバイダー

実践での活用