Next.js E-Commerce App Full Tutorial with the Best Headless Solution
Full-stack e-commerce app project with React Next.js, Tailwind, and Wix Headless. Next.js shopping app course with server actions & headless CMS.
Wix Headless – https://www.wix.com/studio/developers/headless
Wix Headless Docs – https://dev.wix.com/docs/go-headless
Wix Headless Templates – https://www.wix.com/studio/developers/headless/templates
Join the upcoming React Master Course waitlist – https://list.lama.dev
If it is valuable to you, you can support Lama Dev.
Join: https://www.youtube.com/channel/UCOxWrX5MIdXIeRNaXC3sqIg/join
Buy me a coffee: https://www.buymeacoffee.com/lamadev
Join Lama Dev groups
X / Twitter: https://x.com/lamawebdev
Facebook: https://www.facebook.com/groups/lamadev
Instagram: https://www.instagram.com/lamawebdev
Discord: https://discord.gg/yKremu4mPr
Source Code
Starter Branch: https://github.com/safak/next-ecommerce/tree/starter
Completed Version: https://github.com/safak/next-ecommerce/tree/completed
00:00 Introduction
07:26 Next.js Installation
09:44 Next.js App Router Creating Pages and Layout
13:32 Next.js Responsive Navbar Menu with Tailwind CSS
25:18 Next.js Search Input
32:40 Responsive Navbar Icons and Modals
42:43 Next.js E-commerce Cart Component Design
53:55 Next.js Slider Tutorial (Create Your Own Slider)
01:06:37 E-commerce App Product List Page Design
01:14:32 Sliding Category List Design
01:19:55 Next.js Footer Component Design
01:29:21 E-commerce App Product List Page with Filters UI Design
01:36:51 E-commerce App Single Page Design
02:02:43 Next.js Wix Headless E-Commerce App Tutorial
02:10:42 Wix E-Commerce Headless Javascript SDK Tutorial
02:20:09 Next.js E-commerce App Fetch Products
02:28:46 Next.js Fetch Data with React Suspense (Loading Component)
02:38:51 E-commerce App Fetch Categories
02:45:11 E-commerce App Fetch a Single Product
02:50:34 Next.js How to Filter Product Options in an E-Commerce App
03:09:57 Next.js Product Quantity and Add to Cart Button
03:15:29 Next.js E-commerce App Filter Products
03:28:30 Next.js Product Page Pagination
03:36:48 Next.js Authentication with Wix Headless
04:20:36 Next.js Wix E-commerce Cart Functionalities
04:26:45 Next.js Zustand Tutorial (E-Commerce Cart State)
04:47:57 Next.js Wix E-commerce Checkout Tutorial
05:01:45 Next.js Wix E-commerce Orders
05:16:35 Next.js Wix E-commerce User Profile Page
05:28:28 Next.js Form Handling with Server Actions
05:42:37 Next.js E-commerce App User Reviews for Products
05:59:29 Outro