目指せクイズ王!Next.jsとPrismaで構築するAIクイズアプリ(ChatGPT)

Web開発
AI
中級
Next.jsとPrismaでAIクイズアプリを構築していきます。 NextAuthでGoogle認証を実装し、ChatGPTを使用して4択クイズを自動生成します。 クイズのテーマや難易度、言語、問題数も選べるようにしました。 FunctionCallingで確実にクイズを生成する方法も解説します。 データーベースはPostgreSQLを使用し、UIはshadcnを使用しています。 ChatGPTを使用したAIクイズアプリの構築に興味がある方は、ぜひ参考にしてください。

学習内容

・NextAuthを使用したGoole認証の構築方法 ・Prismaのデータベース構築方法 ・ChatGPTを使用した4択クイズの生成方法 ・クイズのテーマや難易度、言語、問題数の選択方法

機能

・Google認証 ・ログアウト ・4択クイズの自動生成 ・クイズ実行 ・クイズ結果

解説動画

YouTubeで解説をしています。
https://youtu.be/SOZkzE2_rkA

解説記事

ステップ

ステップ1
Web開発
AI
初級
目標設定!Next.jsとLangChainで自動タスク生成アプリを作ろう
ステップ2
Web開発
AI
初級
ChatGPTとVOICEVOXを組み合わせて音声チャットアプリを構築!あなたの選んだキャラが読み上げます!
ステップ3
Web開発
AI
初級
ChatGPTの新機能「Function Calling」Next.jsとshadcn/uiで作るチャットアプリ
ステップ4
Web開発
AI
中級
目指せクイズ王!Next.jsとPrismaで構築するAIクイズアプリ(ChatGPT)
ステップ5
Web開発
AI
中級
サブスク入門!Next.jsとPrisma、Stripeでサブスク機能を作ろう
ステップ6
Web開発
AI
中級
リアルタイムグループAIチャットを作ろう!(Next.js15、Auth.js v5、Socket.IO、Prisma、ChatGPT)