Next.js とモダンな技術 (2024年3月) で TODOアプリを作ってみよう(認証機能 ~ E2Eテストまで)
本書では、下記の技術を使用して、ハンズオン形式でTODOアプリを作成します。TODOアプリには、LINEログインによる認証機能、およびタスクの追加・更新・削除機能が存在します。 📍Next.js(Server Actions) 📍Auth.js 📍Supabase 📍Dirzzle ORM 📍T3 Env 📍Zod 📍AutoForm 📍shadcn/ui 📍Vercel また、下記の技術を使用して、UIコンポーネントテスト、およびE2Eテストを実装します。 📍Docker 📍Storybook 📍Playwright 📍GitHub Actions
Chapters
はじめに
作成する TODOアプリの概要
使用技術の紹介
Docker で Next.js の環境を構築しよう
Docker で Supabase の環境を構築しよう
T3 Env と Zod で環境変数をタイプセーフに扱おう
Drizzle ORM で TODOアプリ用のテーブルを作成しよう
Auth.js で LINEログインを実装しよう
AutoForm でタスク追加フォームを実装しよう
タスク管理画面を実装しよう
Server Actions で TODOアプリのタスク関連機能を実装しよう
Storybook で UIコンポーネントテストを実装しよう
Playwright で E2Eテストを実装しよう
GitHub Actions で CI を構築して UIコンポーネントテストと E2Eテストを実行しよう
Vercel に TODOアプリをデプロイしよう
Storybook で VRT を実行しよう
おわりに
Author
Topics
- 公開
- 本文更新
- 文章量
- 約54,084字
- 価格
- 500円