Nextjs Fullstack E-Commerce Shop for Custom Phone Cases 🔥

For Demo checkout following link👇:
Nextjs create custom high-quality phone cases

Final Code👇:
➡ Link 💚: Nextjs create custom high-quality phone cases

If you want to learn how to create it please follow below tutorial👇:
➡ Tutorial Link 💚: Build a Complete E-Commerce Shop with Next.js 14, Tailwind, React | Full Course 2024

⭐DO NOT FORGET TO STAR THIS REPO⭐

Images of The Website:

Features

🛠️ Complete shop built from scratch in Next.js 14
💻 Beautiful landing page included
🎨 Custom artworks made by a professional illustrator
💳 Secret admin dashboard to manage orders
🖥️ Drag-and-drop file uploads
🛍️ Customers can purchase directly from you
🌟 Clean, modern UI on top of shadcn-ui
🛒 Completely custom phone case configurator
🔑 Authentication using Kinde
✉️ Beautiful thank-you email after purchase
✅ Apple-inspired configuration design
⌨️ 100% written in TypeScript
🎁 ...much more

Setting .env

Create a new file on root project with name .env and set your own environment.

KINDE_CLIENT_ID=
KINDE_CLIENT_SECRET=
KINDE_ISSUER_URL=https://project88.kinde.com
KINDE_SITE_URL=http://localhost:3000
KINDE_POST_LOGOUT_REDIRECT_URL=http://localhost:3000
KINDE_POST_LOGIN_REDIRECT_URL=http://localhost:3000/auth-callback

NEXT_PUBLIC_SERVER_URL=http://localhost:3000

STRIPE_SECRET_KEY=sk_test_
STRIPE_WEBHOOK_SECRET=whsec_

ADMIN_EMAIL=

UPLOADTHING_SECRET=sk_live_

DATABASE_URL="postgresql://...."

RESEND_API_KEY=

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev