https://github.com/d-parinita/e-commerce-rest-api-react-website
A modern eCommerce frontend built with Next.js, Tailwind CSS, REST API integration for seamless shopping..
https://github.com/d-parinita/e-commerce-rest-api-react-website
nextjs razorpay reactjs rest-api tailwindcss
Last synced: 7 months ago
JSON representation
A modern eCommerce frontend built with Next.js, Tailwind CSS, REST API integration for seamless shopping..
- Host: GitHub
- URL: https://github.com/d-parinita/e-commerce-rest-api-react-website
- Owner: d-parinita
- Created: 2025-02-10T21:29:12.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2025-03-09T17:08:25.000Z (7 months ago)
- Last Synced: 2025-03-09T17:25:38.784Z (7 months ago)
- Topics: nextjs, razorpay, reactjs, rest-api, tailwindcss
- Language: JavaScript
- Homepage: https://e-commerce-frontend-nine-rho.vercel.app
- Size: 264 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# E-Commerce Frontend Project
## Overview
This project is a modern dynamic e-commerce frontend application built using Next.js, Tailwind CSS, and Context API for global state management. It provides a seamless user experience with optimized performance, responsive design, and secure payment processing.
## Technologies Used
**Next.js** - React framework for the frontend.
**Tailwind CSS** - Utility-first CSS framework for styling.
**Razorpay** - Payment gateway integration for secure transactions.
**REST API** - Communicates with the backend for fetching and managing data.
**Context API** - Handles global state management efficiently.
## Features
**User Authentication** - Secure login and signup functionality.
**Product Catalog** - Displays products with filters.
**Shopping Cart** - Allows users to add, remove, and manage items.
**Secure Payments** - Integrates Razorpay for seamless checkout.
**Order Management** - Users can view past orders.
**Mobile Responsiveness** - Fully optimized for different screen sizes.
## Prerequisites for Setting Up the Project
### 1. Clone the Backend Repository
```sh
git clone https://github.com/babluroy/node.js-eCommerce-Backend.git
cd node.js-eCommerce-Backend
```
### 2. Start the backend server by following the setup instructions from the backend repository.
Ensure the backend is running successfully.
### 3. Set Up the Frontend Environment Variables
In the frontend project, create a `.env.local` file and add the following environment variables:
```env
NEXT_PUBLIC_API_URL=
NEXT_PUBLIC_RAZORPAY_TEST_KEY=
```
Replace `` and `` with the actual values.
### 4. Install Dependencies and Start the Frontend
```sh
npm install
npm run dev
```
The application should now be running successfully.