Skip to content

An online store app written in React with the usage of GraphQL and Apollo Client

License

Notifications You must be signed in to change notification settings

olesiakissa/react-ecommerce-store

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

50 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

E-commerce Store

An online store app written in React with the usage of GraphQL and Apollo Client

Table of contents

Overview

Requirements

The user should be able to

📍 Add products to the cart from home page (PLP), product description page (PDP), Cart modal and on the cart page itself and change their amount The user should be able to add products to the cart from home page (PLP), product description page (PDP), Cart modal and on the cart page itself and change their amount

📍 Add product from PLP to cart without selecting the attributes

📍 View selected attributes should be visible in cart modal and on the cart page

📍 Filter the products by category

📍 Change the currency

What I learned

📍 State management and lifecycle methods in class components

📍 Persisting state between page reloads using web storage

📍 Product filtering

📍 Working with modal window and managing page background on modal opening

📍 Creating image galleries with scroll behavior

Previews

Desktop demo

desktop.mov

Product description pages

Product listing page

Cart modal

Cart page

Mobile demo

mobile.mov

Local installation

ℹ️ If you would like to run this project locally, first please clone the GraphQL endpoint to your machine and install dependencies with npm install and then run the server with npm run start command. The server will be ready at http://localhost:4000

ℹ️ To run the client, clone the project repository and install dependencies and run it the same way. Then you can open http://localhost:3000 to view it in your browser

Useful resources

Links for the quick reference and the further improvements