π Hey Everyone, Welcome back to the Channel. Today we are going to build an E-Commerce Store which has an admin dashboard and a storefront. To build/create this whole video we will use the newest tech on the market which means: Next.js, Kinde-Auth, Neon, Prisma, Stripe, Tailwindcss, Shadcn/UI, Vercel, Upstash and much more. This is a Full Stack tutorial, which means we will build everything from start to finish!
π Kinde Auth: https://dub.sh/xeU8r3v
- π¨π»βπ» GitHub Repository: https://janmarshal.com/courses/build-an-e-commerce-store-using-next-js-kinde-auth-neon-upstache-prisma-stripe-and-tailwind
- π My Website: https://www.janmarshal.com
- β Follow me on X: https://x.com/janmarshaldev
- π§ Business ONLY: jan@alenix.de
Features:
-
π Next.js App Router
-
π Kinde Authentication with MFA
-
π§ Passwordless Auth
-
π OAuth (Google and GitHub)
-
π°Payments using Stripe
-
πͺ Implementation of Stripe Webhooks
-
πΏ Neon Database
-
π¨ Prisma Orm
-
π Upstash Redis for Cart functionality
-
π Recharts for displaying Charts
-
β Server Validation using Zod and Conform
-
ποΈ File Upload with Uploadthing
-
π¨ Styling with Tailwindcss and Shadcn UI
-
πΆβπ«οΈ Deployment to vercel
-
React Streaming
-
Stripe Checkout page
-
Server side implementation
-
Performance Optimized
Resources used:
- Next.js: https://nextjs.org
- Kinde: https://dub.sh/xeU8r3v
- Tailwind.css: https://tailwindcss.com
- Shadcn/UI: https://ui.shadcn.com
- Stripe: https://stripe.com
- Prisma: https://prisma.io
- Neon: https://neon.tech/
- Recharts: https://recharts.org/
- Upstash: https://upstash.com/
- Title: ULTRABOOST 1.0 ATR
- Price: 240
- Description An everyday sneaker with high-quality performance features. This Ultraboost shoe comes with metal buckles instead of laces, perfectly complementing its sleek, modern design. The adidas PRIMEKNIT upper wraps your foot snugly, and the energy-returning BOOST cushioning provides a comfortable feel and optimal support.
- Images in Public Folder
- Title: VaporMax 2023 Flyknit
- Price: $220
- Description: Have you ever walked on air? Check out the Air VaporMax 2023 to see how it feels. The perforated insole reveals the innovative technology (remove it to see more). The stretchy Flyknit upper is made from at least 20% recycled material by weight.
- Images in Public Folder
- Title: Nike Air Max Plus
- Price: 210
- Description: This tuned Nike Air design stands out with top-notch stability, unparalleled cushioning, and adds that special something to your style. Featuring classic '90s style, breathable mesh, and nature-inspired design lines, you can celebrate your bold style with great comfort.
- Images in public folder
- Title: ULTRABOOST DNA 5.0
- Price: 180
- Description: So much more than just a running shoe β with this adidas Ultraboost, you are perfectly equipped for everyday life. This version for kids and teens comes with all the functional features that runners swear by. Additionally, it provides pure comfort. You can thank the soft adidas PRIMEKNIT upper and the energy-returning BOOST midsole for that.
- Images in public folder