Atelier E-Commerce

Table of Contents

• Description
  • Overivew Module
  • Related-Products Module
  • Questions-And-Answers Module
  • Reviews Module
• Installation
• Usage
• Contributing
• Credits
• License

Description

Atelier is a front-facing e-commerce web portal that allows users to view details of specific clothing products. Whether you're interested in different styles, want to see different products, ask questions, or leave a review, Atelier provides a fast and intuitive experience. The page can be broken down into 4 main modules: Overview, Related Products, Questions-And-Answers, and Reviews Module.

Overivew Module

The overview module allows users to examine the product further. Users can view different styles of the product, expand the product image, and add to the cart if interested.

Related-Products Module

The related products feature displays other products a customer might be interested in, based on the one currently selected.

• Click the star icon to view a comparison of any related item to the one currently being viewed.

Also included in this module is an "outfit" feature which allows a customer to build a look by adding and removing products of interest.

• Click "Add to Outfit" to add the item currently being viewed to the outfit list.
• Click the "x" button in the top-right corner of any outfit item to remove it from the list.

Questions-And-Answers Module

The Questions-And-Answers module allows users to query questions and answers related to the product. It sorts both questions and answers by usefulness as well as includes a search bar for specific keywords to streamline the FAQ process. Additionally, there is also a report and thumbs-up feature so that the community can engage and filter valuable and related Q&As

Reviews Module

The reviews module provides an accurate star rating for the product, sorts the reviews list by various criteria, and allows users to submit their own thoughts about the product.

Installation

To install the project, follow these steps:

1. Clone the repository to your local machine.
2. Run npm install to install the required dependencies.
3. Create a .env file in the root directory of the project and add the necessary environment variables for your API.
4. Run npm start to start the development server.

Usage

Once you have the website running, you can use the navigation menu at the top of the page to access the different pages on the website. Each page is designed to be fully responsive and optimized for any device, so you can view the website on a desktop, tablet, or mobile phone.

Contributing

We welcome contributions to our project! If you would like to contribute, please follow these steps:

1. Fork the repository to your own GitHub account.
2. Clone the forked repository to your local machine.
3. Create a new branch from the main branch for your changes.
4. Make your changes to the code or documentation.
5. Test your changes to ensure that they work as expected.
6. Commit your changes with a descriptive commit message.
7. Push your changes to your forked repository.
8. Create a pull request from your branch to the main branch of our repository.
9. Wait for our team to review your pull request and provide feedback or merge it.

Credits

This project was built using the following technologies:

• React
• Axios
• React Router
• Node.js
• Express.js
• Webpack

This project was built by the following team members: Benny Van: Questions And Answers Module Gabriela Taylor: Overview Module Melodie Peck: Related Products Module Ari Tavakoli: Reviews Module

License

This project is licensed under the MIT License.