Learn how to Build and Deploy a full stack integrated E-Commerce website with an Admin Dashboard using Next.js 14, Stripe for payment, TypeScript, MongoDB for all database management, Clerk for authentication and user management, React-Hook-Form for form validation, Tailwind CSS & Shadcn UI for a stunning responsive UI design, and Next Cloudinary for image upload and storage.
This video is perfect for beginner and experienced developers who are looking to learn how to master Next.js 14 App Router
👩💻 Complete Code:
GitHub Links (give it a star ⭐):
- Admin Dashboard: https://github.com/phuc-mai/borcella_admin
- Ecommerce Website: https://github.com/phuc-mai/borcella_store
🎯 In this video, you will:
- Master Next.js 14 with Server-side & Client-side Rendering
- Use Clerk for Authentication & Users management
- Create collections & products with React-Hook-Form for form validation
- Create all Data Tables for collections, products, orders and customers with Search bar
- Handle Search, Add to Wishlist, Add to Cart functions
- Checkout and create orders with Stripe
- Learn MongoDB handling and populating nested schemas
- Create unique & responsive UI design with Tailwind CSS, Shadcn UI, and Recharts for graph
- Image upload and storage using Cloudinary
- Explore & integrate new Next.js layout route groups
- Create reusable components
- Deploy the application and more!
⌚ Time Stamps:
00:00:00 - Intro
00:10:11 - Auth
00:29:30 - Layout
00:46:45 - Create Collections
02:33:19 - Create Products
04:20:11 - Homepage in E-commerce store
05:07:14 - Add to Wishlist
05:26:04 - Product Details page
05:59:03 - Add to Cart
06:38:52 - Checkout with Stripe
07:08:38 - Create order with Stripe webhook
07:45:41 - Orders & Customers dashboard
08:22:35 - Main dashboard
08:47:12 - Search bar
09:14:44 - Wishlist and Orders pages
09:47:49 - Related products
09:59:51 - Deployment