Next E Commerce

Abstract

1. Introduction

I saw a UI design on Dribbble by Anton Mikhaltsov. And I wanted to code this design. So I decided to make it a full working website with NextJS but in just 1 week as challenge myself. Some issues are still there but I will check out them later.

An e-commerce website example built with Next.js that I made in 1 week as a self challenge. There are some issues that I will handle later. Using Firebase as backend. Contact me · Report Bug · Request Feature

2. Objective

An e-commerce website example with NextJS that I made in 1 week as a self challenge. Using Firebase as backend.

This project demonstrates how JavaScript, Next.js, React can be applied to a real-world Full Stack Web Development problem.

4. Technology Stack

• Firebase
• React Hook Form
• date-fns

5. System Requirements

General requirements for this technology stack — check the README for exact versions.

• Node.js (LTS) and npm
• A modern web browser
• VS Code or any code editor
• Git (to clone the repository)

6. Installation & Setup

git clone https://github.com/anilsenay/next-e-commerce.git
cd next-e-commerce

1. You need to create a firebase project
2. Clone the repo and change the directory
3. Install NPM packages
4. Create your .env.local file on root folder(next-e-commerce) with this content. Put your firebase keys.
5. Run in development mode

git clone https://github.com/anilsenay/next-e-commerce.git
cd next-e-commerce

npm install

NEXT_PUBLIC_FIREBASE_API_KEY = your-firebase-api-key
NEXT_PUBLIC_FIREBASE_PROJECT_ID = your-firebase-project-id
NEXT_PUBLIC_FIREBASE_APP_ID = your-firebase-app-id

npm run dev

Full setup instructions are in the project README.

7. Future Enhancements

Suggested extensions you can add to make this your own project.

• Add role-based access control
• Deploy on a VPS or cPanel hosting with a custom domain
• Add automated tests and a CI pipeline

8. Viva / Review Questions

Common questions examiners ask for projects in this domain.

1. Explain the frontend, backend and database layers of this application.
2. How is user authentication and authorisation implemented?
3. Describe the main database tables / collections and their relationships.
4. Which REST APIs or routes are exposed and what do they return?
5. How would you deploy this application to production?

9. Source Code & License

This project is developed by anilsenay and published on GitHub under the GNU General Public License v3.0. Please follow the license terms and credit the original author when you use or modify this code.