電子書籍販売サイト
- PLATFORMWeb
- STACKNext.js, Vercel Postgres, NextAuth.js, Prisma, API Route, Stripe
- WEBSITEhttps://book-commerce-app-nine-tan.vercel.app/
- GITHUBhttps://github.com/ofhfvx0602
電子書籍を販売することができるサイトを制作しました。 Next.js, Vercel Postgres, NextAuth.js, Prisma, API Route, Stripe を駆使して 1 つのフレームワークで Web アプリ開発を行いました。MicroCMS で執筆した電子記事を販売することができます。NextAuth を使った OAuth 認証の実装を行いました。
-
■ 具体的に行ったこと
- MicroCMS と WebHook を使った記事作成の実装を行いました。
- Vercel Postgres を使った DB 管理を行いました。
- Vercel Postgres を使った DB 管理を行いました。
- GithubProvider を利用して OAuth 認証を実装しました。
- PrismaORM を使ってデータ操作ができます。
- getServerSession を使ってサーバーサイドでセッション取得しています。
- microcms-sdk を使ってクライアント側で MicroCMS 専用の API を作成しました。
- Next API Route で API を実装しました。
- 商品購入時の際にモーダルが出現します。
- NextAuth でログイン/ログアウトが実装を行いました。
- Stripe を使ってチェックアウト決済機能を実装しました。
- 決済が完了したら購入完了ページへ遷移できます。
- 購入時に DB に保存履歴を残すことができます。
- 購入履歴のデータを利用して複数回購入を防ぐ実装をしました。
- 商品購入履歴 API を実装しました。
- Typescript ベースで Nextjs 開発ができます。
- ユーザープロフィールページを作成しています。
- ログイン中のユーザーの購入履歴を取得できます。
- 購入した記事一覧取得 API を構築しています。
- Suspense を利用してローディングを実装しています。
- Vercel を使ってデプロイしました。
- 最新記事データを反映させるために SSR を実装しました。
- デプロイ後のパフォーマンス測定も行っています。
- ISR に変更した際に SSR とパフォーマンスの差があるのかも分かります。
- CSR と SSR と ISR をどのように使い分けるのかを理解しています。
- リファクタリングできる箇所がないか？最後に確認しました。