Botanical Store

Open source e-commerce project built with the new Next.js App Router, React 18, TypeScript, Tailwind and Firebase.

Features

• Next.js new /app directory
• Server and Client Components
• Routing, Pages, Layouts and Layout Groups
• Data Fetching, Revalidating, Caching
• Server Actions (experimental feature)
• Route handlers
• Suspense Boundaries, Loading UI and Not found pages
• Static and Dynamic Metadatas
• Add to cart and similar functionalities, can also be stored in localStorage
• Pagination, Search, Sorting, Filters
• CRUD operations + Dashboard table
• Database and storage on Firebase
• Image uploads with dropzone provided by react-drop-zone
• Notification messages with react-hot-toast
• Building forms with react-hook-form and validations using Zod
• Global State management with Zustand
• Written in TypeScript
• Components styled with Tailwind CSS
• Dark/light mode with next-themes
• Available Progressive Web App (PWA)

Run it on your machine

1. Clone the repository

git clone https://github.com/YunisAslan/Botanical-Store.git

2. Install dependencies using pnpm

pnpm install

3. Copy the .env.example to .env and update the variables

cp .env.example .env

4. Start the development server

pnpm run dev

Acknowledgements

• Skateshop13 Skateshop13 repository for design inspirations