- Next.js
- Tailwind
- Stripe
- Redux
- Firebase
100% 完了
Fake Store APIからデータを取得するオンラインショッピングアプリケーション。ホーム、チェックアウト、注文にはSSRを使用し、製品プレビューにはCSRを使用してSWRを介しています。Stripeは支払いを処理し、apiフォルダ内のカスタムフックはチェックアウトデータをFirebaseに保存します。NextAuthはGoogle OAuthとユーザーセッションを提供し、Redux Toolkitは状態を管理し、Framer Motionは完全なUXにアニメーションを追加します。
ハイライト:
- サーバーサイドレンダリング
- クライアントサイドレンダリング (SWR)
- Google OAuth認証 (via NextAuth)
- 支払いのためのStripeチェックアウト
- 注文管理のためのStripe Webhooks
- データストレージのためのFirebase V9
- Firebaseのためのサービスアカウント (Node.js)
- パフォーマンスのためのコード分割