Build a Shopping App With Next.js + NestJS & Prisma

Set up a Prisma service in NestJS to create users with a type-safe Prisma client, hash passwords with bcrypt, handle unique email errors, and return only id and email.

Apply a server action to create users with a form data payload, using the no-files interceptor to parse multipart form data, handle errors, and persist the user in Nestjs.

Enable NestJS authentication with passport local strategy, verify email and password, issue a jwt, protect routes with a guard, and wire up an auth module and login route.

Implement NestJS JWT authentication by extracting the current user, signing a token with their id, and sending it as a httpOnly, secure cookie.

Implement a global fetch wrapper in a Next.js app to send all post requests as JSON to a NestJS backend, converting form data to JSON and standardizing error handling.

Set the authentication cookie on the Next.js server from the NestJS login response. Parse the JWT from the Set-Cookie header and store it as a secure, HttpOnly cookie.

Implement authentication checks on the Next.js UI using server-side middleware to protect routes, redirect unauthorized users to /login, and exclude static assets with a custom matcher.

Implement an end-to-end logout flow in a Next.js and NestJS app by clearing the authentication cookie on the server and redirecting to the login page, while enabling programmatic navigation.

Learn to add a create product modal triggered by a floating action button, using client components, state management, and a Material UI modal to submit new products.

Implement product image uploads in the NestJS backend using Multer with disk storage to public/products, validate file type and size, and serve images as static content behind a JWT guard.

Build a product upload UI with a button and a hidden input to attach an image, display the file name, and upload via multipart form data to a NestJS server.

Expose the get product API in Next.js, fetch a product by id on the server, and render a single product with image, description, and price using a material UI grid.

Initialize the stripe js client with a publishable key in a Next.js UI, then generate a checkout session via the NestJS backend and redirect to Stripe hosted checkout.

Learn to configure stripe webhooks for checkout events, use the Stripe CLI for local testing, and update a product's sold status via Prisma, guided by session metadata.