Build A Complete E-Commerce Website (Next.js 15, React Query, Tailwind CSS, TypeScript, Wix Studio)

Build and deploy a full-stack e-commerce website with Next.js 15 and Wix Studio Headless. Great for (aspiring) freelancers or for your own portfolio. Features and technologies: -Next.js 15 -React Query for caching, optimistic updates, and infinite loading lists -Search & filter URL state management with useOptimistic -User accounts and anonymous shopping carts -Product options, variants, and inventory management -Checkout from cart or single product -User reviews with image & video uploads -Email automations (Back in stock notifications, review reminders, etc.) -Payment & shipping provider integration -Real-time form validation with React Hook Form & Zod -Mobile-responsive layout with Tailwind CSS & Shadcn UI components -Pagination -Dark theme, light theme, and system theme -Advanced Next.js layout patterns -Code best practices & architecture -IDE setup with Prettier & plugins -Deployment on Vercel Starting code: https://github.com/codinginflow/nextjs-15-wix-store/tree/0-Starting-Point Create a free Wix account: https://www.wix.com/studio Wix Headless setup link: https://www.wix.com/intro/headless Project files: Shadcn custom theme (globals.css): https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/src/app/globals.css Assets/images: https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/public/placeholder.png https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/src/assets/logo.png https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/src/assets/banner.jpg https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/src/app/favicon.ico https://github.com/codinginflow/nextjs-15-wix-store/blob/0-Starting-Point/src/app/opengraph-image.png Footer: https://github.com/codinginflow/nextjs-15-wix-store/blob/final/src/app/Footer.tsx Terms page: https://github.com/codinginflow/nextjs-15-wix-store/blob/final/src/app/terms/page.tsx Full source code: https://github.com/codinginflow/nextjs-15-wix-store Part 2: https://www.youtube.com/watch?v=cTcCXfDm_7k ⭐ Get my full-stack Next.js with Express & TypeScript course: https://codinginflow.com/nextjs ✅ Get my free React Best Practices course: https://www.codinginflow.com/reactbestpractices 💌 Join my newsletter for regular web dev tips: https://codinginflow.com/newsletter 💬 Join our developer community on Discord: https://codinginflow.com/discord 📣 Follow Coding in Flow on social media: Twitter: https://twitter.com/codinginflow Instagram: https://instagram.com/codinginflow TikTok: https://tiktok.com/@codinginflow Facebook: https://facebook.com/codinginflow Timestamps: 0:00 - Project overview 25:54 - Project & IDE setup (create-next-app, Shadcn UI, Prettier Tailwind plugin, VS Code extensions) 54:10 - Wix Studio setup & store configuration 1:00:37 - Creating products & categories 1:12:16 - Setting up Wix OAuth, T3 Env & Wix client 1:22:19 - Fetching products server-side (Suspense boundary) 1:58:35 - Product & WixImage components (advanced TypeScript type) 2:30:50 - Navbar (fetch shopping cart) + footer 2:41:24 - Wix API layer 2:52:35 - Product details page (generateMetadata, client component, React cache, loading.tsx, staleTimes) 4:38:36 - Add products to cart 4:48:21 - Session middleware (access & refresh tokens), Wix server/browser clients (js-cookie) 5:13:23 - Shopping cart button (React Query, useQuery, initialData, useMutation, cache mutation) 5:42:20 - Shopping cart sheet (optimistic updates with React Query) 6:34:34 - Back-in-stock notifications (React Hook Form validation, email automation) 7:01:39 - Member login (OAuth callback)