FRONT-END-CAPSTONE
overview description installation usage
Our outdated client-facing retail web-portal has become significantly outdated and has been proven to be hurting sales numbers.
Project Catwalk comprises a complete redesign of the retail portal designed to address this concern and modernize the site.
- Product Detail - Critical Priority - General information about the product will be displayed at the top of the Overview, such
as, an image gallery, product information, style selector, and an add to cart section. This component will guide the customer
through selecting a specific style and size to add to their cart.
- Ratings & Reviews - High Priority - The Ratings & Reviews module will allow viewing and submission of reviews for the product
selected. The functionality contained within this module can be divided into several pieces: A review list & a write new
review option, have a sorting option for products, a search bar for key words, and rating breakdown option (filter most recent
and best reviewed products).
- Questions & Answers - High Priority - The Questions & Answers module will allow asking and answering of questions for the
product selected. The functionality contained within this module can be divided into several pieces: section for viewing
questions, a section for asking a question, and a section for responding to a question.
- Related Items & Comparison - High Priority - The Related Items & Comparison module will display two sets of related
products. The first set will be a list of products, determined internally, that are related to the product currently being
viewed. The second set will be a list, custom created by the user, of products which the user has grouped with the current
product into an ‘outfit’.
- run "npm install" in terminal
- run "npm start" in terminal to start up the server
- run "npm run react-dev" in terminal to start up react and webpack
-
React - React. js is an open-source JavaScript library that is used for building user interface applications. https://reactjs.org/docs/getting-started.html#learn-react
-
Express - Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications. http://expressjs.com/en/4x/api.html
-
Axios - Axios makes it easy to send asynchronous HTTP requests to REST endpoints and perform CRUD operations. https://github.com/axios/axios/blob/master/README.md#request-method-aliases
-
CSS Flexbox - Flexbox makes it simple to align items vertically and horizontally using rows and columns. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
-
JSX - JSX stands for JavaScript XML. ... JSX makes it easier to write and add HTML in React. https://reactjs.org/docs/jsx-in-depth.html
-
Webpack/Babel - webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser. https://webpack.js.org/concepts/