|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/e2e-nextjs-app-dir-playwright/
课程评论：没有评论
【E2Eテスト編】Playwright + Next.js App Router によるフロントエンドテスト コース概要 本コースは、Microsoft製のE2EテストフレームワークであるPlaywrightを用いて、Next.js App Routerによるフロントエンドアプリケーションのテスト手法を学ぶものです。Playwrightは、React-testing-libraryの作者であるKent C. Dodds氏も推奨しており、Cypressからの移行トレンドが予想される注目の技術です。 **学習内容:** * **Playwrightの基本:** Playwrightを使ったフロントエンドE2Eテストの実施方法。 * **Next.js App Routerとの連携:** Next.js 13のApp Router環境でのテスト。 * **テスト用認証情報:** storageStateを利用したテスト用認証情報（Cookie）の作成と、それを用いたテストケースの実装。 * **CRUD操作のテスト:** アプリケーションにおけるCreate, Read, Update, Delete操作のテスト。 * **GitHub認証:** NextAuthを用いたGitHub認証の実装。 * **Server Componentでの認証:** Server Componentにおける認証処理の実装。 * **認証保護APIルート:** Cookieを用いた認証保護されたAPIルートの実装。 * **zodによるバリデーション:** APIルートにおけるzodを用いた入力値バリデーションの実装。 **対象アプリケーション:** * **フロントエンド:** Next.js 13 App Router * **バックエンド:** Next.js API Routes (認証およびzodによる入力値バリデーション付き)
本コースでは、Microsoft製のE2Eテストのフレームワーク Playwrightを使用したフロントエンドテスト手法について学習します。Playwrightは、Kent C. Dodds氏(React-testing-libraryの作者 + Remixのmain contributor)も推している注目技術です。E2Eテストは、CypressからPlaywrightへの移行トレンドが予想されます。テスト対象のアプリケーションは、フロントエンド: Next.js 13 app dirバックエンド: Next.jsのAPI routes (認証 + zodによる入力値バリデーション付き)を使用します。Playwrightを使用したフロントエンドE2Eテスト(Next.js app dir)storageStateを使用したテスト用認証情報の作成(cookie)認証情報有無のテストケース実装CRUD操作のテストケース実装NextAuthを使用したGitHub認証の実装Server componentにおける認証方法 (cookie)認証保護されたAPI routesの実装zodによる入力値バリデーションの実装 (API routes)
