Skip to content

jmpherso/atelier-storefront

 
 

Repository files navigation

👚 Project Atelier

🗏 Table of Contents

🔍 Project Details

Project Atelier is the Front End Capstone project for Hackreactor. It requires the creation of React based web-app that simulates the experience and functionality of a modern shopping page.

🖥️ Tech Stack

JavaScriptReactJestNodeJSExpress.js

Components

Overview

The overview component shows users basic product info like price and name, and allows users to browse styles, inspect product and style images, and choose sizes and amounts to add to the cart. overview

Related Products

The related products and outfit component allows users to browse related components, see comparisons to currently selected components, add products to an "outfit", and displays basic product info for related products. related

Questions

The questions component allows users to submit answers and questions, mark questions and answers as helpful, browse images attached to answers, and filter questions via a search bar. questions

Ratings

The ratings component allows users to view a products ratings, filter reviews by rating value, and sort reviews by different metrics, as well as submit a new review. ratings

Built Using

💾 Installation

Requirements

Installing and running this project requires the use of a github token, as well as the following packages

node
npm

Further information on obtaining a github access token here.

Instructions

  • Clone the repository locally

git clone https://github.com/jmpherso/front-end-capstone.git

  • Install dependances

npm install

  • Create a file in the project root folder named ".env", and add the following text to it :
AUTHTOKEN = githubtoken
PORT = 1100

Note : Replace githubtoken with your own github API access token. The port can be any port of your choosing.

  • Build via webpack

npm run build

  • Start server

npm run server

About

Front end portion of a storefront web app.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 84.2%
  • SCSS 11.8%
  • CSS 3.7%
  • HTML 0.3%