Build and Deploy Ecommerce App with Django, Next.js and Stripe - #2

Build and Deploy a Fullstack E-commerce Web App with Next.js and Django!
In this comprehensive tutorial, we build a complete e-commerce web application from scratch using Next.js for the frontend and Django for the backend.

You'll learn everything from creating a modern UI with Shadcn UI, setting up dynamic routing, implementing Google OAuth login with NextAuth, connecting to a Django REST API, handling product reviews, cart and wishlist functionality, and integrating Stripe for secure payments.

By the end of this series, you'll have a fully functional, beautifully designed, and production-ready e-commerce application.

🛒 Ecommerce Live URL: https://next-shop-self.vercel.app/

🔧 Topics Covered in Part 2:
1. Fetch & display featured products/categories
2. Dynamic routing in Next.js
3. Product details & related items
4. Star-rating & review system
5. Update/Delete reviews
6. Add to cart functionality
7. Toast notifications for user feedback
💻 Source Code
- Fullstack (Next.js + Django + Stripe Integration): https://selar.com/171g11

- Backend Only (Django): https://github.com/CodeWithClinton/yt_ecommerce_api_2025
- Frontend Only (Next.js): https://github.com/CodeWithClinton/next-shop-frontend
▶️ Watch the Full E-commerce Series
- Part 1: https://youtu.be/k787AkYmrFg
- Part 3: https://youtu.be/q0VWqKalXfc
📚 Related Tutorials
Build the backend API with Django: https://youtu.be/N3G9OjOuUi8
Deploy Django and PostgreSQL on Railway: https://youtu.be/dpniJG_5Dnk
🖼️ Image Assets Used in the Tutorial:
https://drive.google.com/file/d/1Ao2HV1Q_rparmjyjGRmJyZHIfYQlPBRP/view?usp=sharing
⏱️ Timestamps:
00:00:00 – Fetching Featured Products and Categories
00:07:25 – Rendering Categories on the Homepage
00:17:26 – Adding Loaders Using React Suspense
00:23:00 – Displaying Featured Products
00:33:11 – Routing to Category Detail Page
00:36:24 – Displaying Data on the Category Detail Page
00:51:47 – Highlighting the Active Category
00:57:55 – Adding Loader to the Category Page
00:59:41 – Routing to Product Detail Page
01:01:24 – Resolving Next.js Errors
01:02:52 – Using generateStaticParams in Next.js
01:06:46 – Rendering Dynamic Product Details
01:21:36 – Displaying Review Statistics and Ratings
01:34:26 – Rendering Product Reviews
01:51:44 – Using Collapsible Component for Reviews
02:02:55 – Displaying Related Products
02:07:34 – Adding a page loader and Conditionally displaying the "Add Review Button"
02:14:58 – Adding reviews to products
02:38:36 – Integrating React Toastify for Notifications
02:42:39 – Showing Loading Indicator When Adding Reviews
02:47:09 – Review form can't be submitted without a rating or review
02:50:02 – Hiding the add review button if a user already has a review on a product
02:54:06 – Making the add review form reusable for updating a review
03:19:06 – Updating a Review
03:32:49 – Deleting a Review
03:50:53 – Adding Items to the Cart
04:45:29 – End of Part 2

Видео Build and Deploy Ecommerce App with Django, Next.js and Stripe - #2 канала Code With Clinton