E-commerce Front-End

This is the React front-end for a full-stack e-commerce project. It provides a modern, responsive user interface for customers to browse products, manage their shopping cart, and place orders.

This application consumes the REST API provided by the back-end, which can be found here.

Core Features

• Modern UI built with React for a fast, single-page application experience.
• Product Catalog where users can browse and search for items.
• User Authentication pages for login and registration.
• Shopping Cart functionality to add, view, and modify items.
• Order History page for authenticated users to view their past orders.
• Protected Routes to ensure only authenticated users can access certain pages (like their profile or cart).

Built With

• React 18 for building the user interface.
• React Router for client-side routing.
• Axios for making API requests to the back-end.
• CSS Modules / Styled-Components (or your chosen styling solution) for component styling.
• NPM / Yarn for package management.

Getting Started

To get a local copy running, follow these simple steps.

Prerequisites

You'll need to have these installed on your machine:

• Node.js (v16 or newer recommended)
• npm or yarn

How to Run

1. Clone the repo:

   git clone https://github.com/taherb22/E-commerce_website-front-end.git
   cd E-commerce_website-front-end

2. Install dependencies:

   npm install
   # or if you use yarn:
   # yarn install

3. Configure the API endpoint: Create a .env file in the root of the project directory. This file will tell your React app where the back-end server is running.

   Note: Make sure your back-end server is running and accessible at this URL.

4. Start the development server:

   npm start
   # or if you use yarn:
   # yarn start

   The application will open automatically in your browser at http://localhost:3000.

Available Scripts

In the project directory, you can run:

• npm start: Runs the app in development mode.
• npm test: Launches the test runner in interactive watch mode.
• npm run build: Builds the app for production to the build folder.
• npm run eject: Ejects from Create React App (a one-way operation).