FEC Capstone Project for HackReactor
Creating a client-facing retail webportal from scratch using JavaScript and React
Britta Moore: Product Overview Lead George Khoury: Question and Answers Lead Nathanael Tjen: Ratings and Reviews Lead Sandy Chu: Related Products and Outfit Lead
FEC23 is a revamp of an e-Commerce webpage designed to display relevant product information and allow user engagement for a given product.
The FEC23 webpage can be split into the following subcomponents:
The landing page of the featured product's preview image, image gallery, distinct styles, stock, and description. Users are able to select different available styles, sizes, share the featured product on social media, and add valid quantities of any given style and size to their cart.
2023-02-27.12-10-09.online-video-cutter.com.mp4
Contains the questions and answers pertaining to the featured product. The Q&A subcomponent allows user interaction with any given question or answer such as marking an input as helpful/not helpful, dynamically rendering questions matching a search query, and allowing users to ask a new question or add an answer to an existing question.
2023-02-27.12-10-09.online-video-cutter.com.1.mp4
Displays the ratings of a product based on user created reviews. Ratings and reviews for each product can be filtered by a review's star rating, as well as user based ranking of helpful reviews. Users are also able to create a new review for the featured product via a modal form that prompts users to fill in required fields.9o
2023-02-27.12-12-25.online-video-cutter.com.mp4
Displays products related to the featured product and allows users to navigate to the Product Overview page upon clicking a new product. The RPO additionally allows unique users to save products within their browser's local storage. The related products component allows users to compare characteristics between the featured product and any given related product.
2023-02-27.12-50-16.online-video-cutter.com.mp4
@babel eslint Jest Webpack Axios Express React