CaseCaobra: Custom iPhone Case

📋 Table of Contents

1. 🤖 Introduction
2. ⚙️ Tech Stack
3. 🔋 Features
4. 🤸 Quick Start

🤖 Introduction

A cutting-edge Custom Case App that enables users to create, discover, and enjoy mobile custom case, with their custom image. Case cobra is website to design the mobile case with your photo. Basically this a mobile case store. Here, you put your image on the case. This ecommerce with the admin dashboard. Admin Dashboard access only for the one email which the admin.

⚙️ Tech Stack

• Next.js
• TypeScript
• PostgreSQL
• Redis
• Kinde
• ShadCN
• Tailwind CSS

🔋 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

🤸 Quick Start

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)
• bun (Bun Package Manager)

Cloning the Repository

git clone https://github.com/samarth-kamble/Case-Ecommerce.git
cd Case-Ecommerce

Installation

Install the project dependencies using npm:

npm install

or

bun install

Set Up Environment Variables

Create a new file named .env in the root of your project and add the following content:

#PostgreSQL URL (NEON.TEch)
DATABASE_URL=

#  Kinde Auth
KINDE_SITE_URL=
KINDE_POST_LOGIN_REDIRECT_URL=
KINDE_POST_LOGOUT_REDIRECT_URL=
KINDE_CLIENT_ID=
KINDE_CLIENT_SECRET=
KINDE_ISSUER_URL=

# Web URL
NEXT_PUBLIC_SERVER_URL=

# Admin Email
ADMIN_EMAIL=

# UploadThing Crendntial
UPLOADTHING_SECRET=
UPLOADTHING_APP_ID=

# Stripe Crendential
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=

# Resend Crendential
RESEND_API_KEY=

Running the Project

npm run dev

or

bun run dev

Open http://localhost:3000 in your browser to view the project.