Build a Full-Stack eCommerce Website with Next.js 15, TypeScript, Sanity, Firebase & Stripe - Part 1

preview_player
Показать описание
Welcome to Part 1 of our full-stack eCommerce website build series! In this video, we're diving deep into how to create a modern, high-performing eCommerce application using the latest tools in web development.

Authentication is key, so we’ll configure NextAuth to enable secure and seamless user login, tailored to support modern eCommerce flows. To handle transactions, we'll integrate Stripe for reliable, secure payment processing, making it easy to manage checkout experiences.

Whether you're building your first eCommerce app or looking to enhance your skills, this series will guide you through each step of the way with clear, practical insights. Be sure to follow along, and don’t miss any part of this series as we bring this eCommerce project to life!

What You’ll Learn in This Video:

Configuring Firebase Firestore Admin for backend data management
Hosting and managing products with Sanity CMS
Integrating NextAuth for secure user authentication
Setting up Stripe for payment processing
Stay tuned for the upcoming parts, where we’ll dive deeper into adding features, enhancing performance, and building out a complete eCommerce experience!
  1. Noor Mohammad
  2. full-stack ecommerce website tutorial
  3. nextjs 15 ecommerce project
  4. complete ecommerce series
  5. fullstack ecommerce website
  6. ecommercer website using nextjs 15
Рекомендации по теме
Create Full Stack 13:32:42

Create Full Stack E-commerce Website Using React JS | MERN Stack eCommerce Project with Stripe

How To Create 9:09:48

How To Create Full Stack E-Commerce Website Using React JS, MongoDB, Express & Node JS 2024

Build and Deploy 3:34:12

Build and Deploy a Modern Full Stack ECommerce React Application with Stripe

Build and Deploy 3:52:17

Build and Deploy a Full Stack E-Commerce App with an Admin Dashboard & CMS in 2024 | Next 14, St...

Full Stack Ecommerce 22:45:43

Full Stack Ecommerce Project | Next js, Vite, Tailwind, Stripe & More | Full tutorial | Source C...

Build a Fullstack 11:49:45

Build a Fullstack E-commerce using Next.js (react.js, mongo, tailwind, styled components)

Full Stack E-Commerce 10:41:33

Full Stack E-Commerce + Dashboard & CMS: Next.js 13 App Router, React, Tailwind, Prisma, MySQL, ...

🔴 Let's build 5:11:15

🔴 Let's build a Full Stack E-Commerce App with NEXT.JS 15 (Sanity, Stripe, Clerk, Tailwind, TS)...

How I Created 0:00:25

How I Created a Stunning Gaming Website from Scratch! 🚀 | Full Code Demo #YouTubeCoding #cricket

MERN Stack Full 14:39:12

MERN Stack Full Course - ECommerce App with Admin Panel : React, Redux Toolkit, Tailwind, MongoDB

Build & Deploy 10:20:31

Build & Deploy Full Stack E-Commerce Website + Admin Dashboard | Next.js, Stripe, Tailwind, Mong...

How to OVER 0:11:20

How to OVER Engineer a Website // What is a Tech Stack?

Build a FULLSTACK 4:10:15

Build a FULLSTACK React Ecommerce App that is fully Responsive with Stripe Payment

Build A Complete 7:36:18

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

Building a Full-Stack 12:18:01

Building a Full-Stack MERN E-Commerce Site - From Scratch!

Full Stack E-Commerce 17:20:39

Full Stack E-Commerce Responsive MERN App with Auth, Search, Filter, Upload Product | React, MongoDB

Build an e-commerce 0:01:29

Build an e-commerce website in 1 minute using ChatGPT #openai #chatgpt

Build and Deploy 13:26:58

Build and Deploy a Full-Stack E-Commerce: Next.js 13, React.js, Typescript, Tailwind, Prisma, Stripe

Full Stack Ecommerce 3:42:33

Full Stack Ecommerce Store With Admin Dashboard From Scratch - Next.js, Prisma, Stripe, Tailwind

Fullstack development Roadmap 0:00:49

Fullstack development Roadmap - https://roadmap.sh/full-stack

Build, Test and 2:26:41

Build, Test and Deploy a Full Stack Next JS E-Commerce from Scratch. (2024)

Full Stack Developer 0:00:18

Full Stack Developer in 6 Months

E-Commerce Design in 0:00:16

E-Commerce Design in FlutterFlow 🛍

How I Create 0:05:28

How I Create Modern E-Commerce Stores with Next.js

Комментарии
Автор

A feedback - in the previous e-commerce video, the add-to-cart functionality was nice. When user adds item to cart, then the "add to cart" button should either be disabled, or should convert into quantity selection (like in the previous e-commerce video). This should be the basic shopping experience for a user, unlike in the current video where when an item is added, the button is still functional and still reads "add to cart".

vinoobharadwaj
Автор

Congratulations for this project. The design to start with, is fantastic. The app has UX of a high standard, and the fact that the making is step by step without git repos and copy-paste, is very importand for all of us who came here to learn! Thank you!

antonioskokiantonis
Автор

Approximately how many parts will it take?

fikreterkara
Автор

I've just finished the video. The only thing left behind, is that I could'nt find the API_VERSION and the PROJECT_ID, so I couldn't test for example the console.log(banners) at the end. Where are those located?

antonioskokiantonis
Автор

Thank you 🙏
I’m getting hydration error when install nextjs 15

afaqahmad