Creating a Fullstack E-Commerce web app in Next13, React.js, Typescript, TailwindCSS, Prisma, Stripe, Next Auth, MongoDB and more..
✨ Source Codes: https://www.patreon.com/posts/next13-fullstack-86787700?utm_medium=clipboard_copy&utm_source=copyLink&utm_campaign=postshare_creator&utm_content=join_link
✨ e-shop-assets: https://github.com/chaoocharles/e-shop-assets
✨ Playlist: https://youtube.com/playlist?list=PL63c_Ws9ecISwPzddQzQ671S_gzJA6M5z
✨ Follow Me on Twitter: https://twitter.com/ChaooCharles
✨ Join My Discord Server
https://discord.gg/WGqJ2CZebb
🤑 Donate To My PayPal: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=NZCBMP9V54G9J&source=url
Features:
🖌️ Awesome UI in TailwindCSS
🛒 Complete Shopping Cart
🔐 Authentication with Google Login in Next Auth
💰 Payment Integration in Stripe
👀 Admin Dashboard
📉 Shop Statistics (Summary)
⬆️ Image Uploads in Firebase Storage
🔎 Search Functionality
👨👩👧👦 Product Categories
🔥 Product Rating
🛠️ Manage Products
🛠️ Manage Orders
🚀 Deployment
Sections:
00:00 – Intro
12:44 – Prerequisite
13:39 – Creating a Next13 App
18:32 – theRootLayout
23:25 – Adding Fonts
25:52 – Our App Layout
32:43 – Container Component
36:15 – NavBar
43:05 – Footer
56:47 – Home Banner
01:05:01 – List Products
01:13:22 – Product Card
01:31:31 – Pages and Routes
01:39:18 – Product Details
01:55:24 – Cart Product State and Types
02:02:45 – Color Select
02:17:32 – Product Quantity
02:27:46 – Button Component
02:37:36 – Display Product Images
02:48:43 – List Product Reviews
02:59:13 – Avatar Component
03:03:44 – useCart Hook
03:11:27 – CartProvider
03:17:38 – Add Product to Cart
03:36:38 – Persist the Cart
03:41:22 – React Hot Toast
03:44:36 – Cart UI
03:59:06 – Cart Item Design
04:11:33 – Remove Item From Cart
04:16:09 – Increase Cart Quantity
04:22:07 – Decrease Cart Quantity
04:25:09 – Clear Cart
04:27:53 – Calculate Subtotal
04:38:56 – Total Cart Quantity and Amount
04:45:51 – Authentication in Next Auth
06:41:19 – Processing Payment with Stripe
08:09:50 – Admin Dashboard Intro
08:14:20 – Admin Page and Nested Navbar
08:31:38 – Creating/Adding a Product
10:09:42 – Manage Products
10:53:37 – Manage Orders
11:42:04 – Show Products From DB
11:50:26 – Product Categories
12:04:07 – Adding Product Reviews
12:26:24 – Search Bar
12:33:20 – Admin Summary
13:05:38 – App Deployment
SUPPORT MY CHANNEL
📍SUBSCRIBE: https://www.youtube.com/channel/UCe8uN9zoKksCb1hfw61myRw?sub_confirmation=1
📍Become a Channel Member:https://www.youtube.com/channel/UCe8uN9zoKksCb1hfw61myRw/join
📍Join My Fun Channel: https://www.youtube.com/channel/UCy4bfau19vYgrPBhCCI2Zbg
GET IN TOUCH:
📍 Twitter: https://twitter.com/ChaooCharles
Disclaimer: This video is not sponsored
