このハンズオンでは、実際にコードを書きながらウェブ開発に必要不可欠なテストスキルを身につけることができます。
Next.jsを利用したアプリ開発から始まり、JestとReact Testing Libraryによる単体テスト、さらにPlaywrightによるE2E（エンドツーエンド）テストまでのテスト戦略を実践的に学びます。

内容
◆JestとReact Testing Library(RTL)を使った単体テスト・結合テスト
・JestとRTLを使ってReactコンポーネントの単体テスト・結合テストを実施します。
・カスタムフックのテストを実施します
・Container/Presentationalパターンを利用したサーバーサイドコンポーネントのテストを実施します
◆Playwrightを使ったE2Eテスト
・実際のユーザー体験に基づくエンドツーエンドテストを実施します。

この本では、理論だけでなく、実際に手を動かしながら学ぶことでより深い理解と実践的なスキルが身につきます。次のステップへ進むための実力を身につけましょう！



実践！書いて覚えるテストの基本 [ハンズオン🚀]

プロジェクトのセットアップ

もしコードが動かない場合

Seeding

テストの基本の基本解説＋簡単なテストをやってみよう！

カバレッジを見てみよう！

ログインフォームをテストしよう！

スナップショットテストをやろう！

カスタムフックをテストしよう！

ブログの投稿画面を作ろう！【カスタムフックテスト編】

ブログの投稿画面を作ろう！【サーバーアクションテスト編】

ブログの投稿画面を作ろう！【コンポーネントテスト編】

ブログの一覧画面を作成しよう【実装編】

ブログの一覧画面を作成しよう【テスト編】

E2Eテストを始めよう！(Playwright)

テスト用のDBを使おう！

ログインをテストしよう！＆セッションの使い回し

ブログの新規作成をテストしよう＆バグを直そう！

まとめ（ソースコード）

nextjs

react

test

jest

playwright

yuyan