kamalheydari / digikala-clone-nextjs

advance clone of digikala includes products page, single product page, category, sorting, filtering, JWT authentication, login page, register page, edit user information, order cart, review and admin dashbord to add new product, accept reviews, add category, details and specification for category and more...

Home Page:https://digikala-clone-nextjs-p.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Digikala Clone NextJs

A advance clone of digikala includes products page, single product page, category, sorting, filtering, JWT authentication, login page, register page, edit user information, order cart, review and admin dashbord to add new product, accept reviews, add category, details and specification for category and more...

Using

  • NextJs
  • Typescript
  • TailwindCss
  • MongoDB
  • Redux - Toolkit - RTK Query
  • JWT

Features

Full-stack e-commerce website

  • Allows registered users to place orders, write product reviews, and update their account information.

Admin privileges

  • Enables creation of new product categories.
  • Allows definition of unique specifications and features for each category.
  • Manages banners, sliders, and new product listings.
  • Updates the status of orders and reviews.

User-friendly search, filter, and sort functions

  • Enables easy product discovery and sorting based on user preferences.
  • Displays top discount products, most favorited items, and best-selling products for each category.

How to install and run the project ...

  1. Clone or download the repository by running the following command in your terminal:
git clone https://github.com/kamalheydari/digikala-clone-nextjs.git
  1. Install the project dependencies using either npm or yarn:
npm install

or

yarn
  1. Define the required environment variables in a file named .env.local located in the root directory of the project. The following variables are necessary:
    MONGODB_URL=<your MongoDB connection URL>

    JWT_SECRET_KEY=<your access token secret>

    NEXT_PUBLIC_LIARA_ENDPOINT=<your Liara endpoint>
    NEXT_PUBLIC_LIARA_BUCKET_NAME=<your Liara bucket name>
    NEXT_PUBLIC_LIARA_ACCESS_KEY=<your Liara access key>
    NEXT_PUBLIC_LIARA_SECRET_KEY=<your Liara secret key>
  1. Install MongoDB and MongoDB Compass on your local machine. If you already have a MongoDB instance set up, skip this step.

  2. Download the database from the following link:

https://drive.google.com/drive/folders/1tonl8z-LbPM_umavCs9DBVs4hc0CmwVd?usp=sharing
  1. Create a new database in MongoDB Compass and create the required collections with the same names as the downloaded JSON files. Then, import the data from the downloaded files into the corresponding collections.

  2. Log in to Liara for free and create a new bucket (ذخیره سازی ابری). Then, set the last four environment variables listed above to the corresponding values provided by Liara. This will allow the application to use Liara for cloud storage.

  3. Create an account by accessing the following URL in your web browser:

http://localhost:3000/authentication/login
  1. After creating the account, find your account in the database and change the role field to root. This will grant you access to all the admin dashboard features.

Demo

See demo on vercel Nextjs Digikala Clone

Home Page

demo

Category Page

demo

Products Page

demo

Product Page

demo

Cart Page

demo

Shipping Page

demo

Profile Page

demo

Adrress Page

demo

Orders Page

demo

Admin/Products Page

demo

Admin/Edit Page

demo

Admin/Details Page

demo

Admin/Categories Tree Page

demo

Admin/Banners Page

demo

Admin/Categories List Page

demo

Admin/Category Create Page

demo

Admin/Sliders Page

demo

About

advance clone of digikala includes products page, single product page, category, sorting, filtering, JWT authentication, login page, register page, edit user information, order cart, review and admin dashbord to add new product, accept reviews, add category, details and specification for category and more...

https://digikala-clone-nextjs-p.vercel.app


Languages

Language:TypeScript 98.5%Language:CSS 1.0%Language:JavaScript 0.5%