Minimalistic-storefront

A mock-up page of an imaginary online shop, fetching data from the GraphQL endpoint.
You can check live demo here.

Table of Contents

• General Info
• Technologies Used
• Features
• Setup
• Acknowledgements
• Contact

General Information

• As the name suggests, it is an imaginary online shop, fetching data from the GraphQL endpoint.
• It consists of three main pages:
  • PLP (product listing page)
  • PDP (product description page)
  • Cart page
• More info on the project and screenshots can be found in Features.

Technologies Used

• React, React Router, TypeScript
• Apollo Client (GraphQL)
• Redux + Redux Persist
• Testing: Jest, React Testing Library
• Code Quality: ESLint, Prettier
• CI/CD: GitHub Actions, Firebase Hosting
• Additional Tools: React Transition Group, Interweave

Features

• Browse our store to choose from vast variety of products - whether you into tech or clothes you can be sure to find something that catches your eye.
• Easily switch between range of accepted currencies.
• Check what's in your cart at one click.
• Visit a product page to learn more about product and configure it to your needs.
• Proceed to the cart to see summary of your current buy.

Setup

To run this project locally:

1. Clone this repository

  $git clone https://github.com/noszczykmichal/minimalistic-storefront

2. Go into the repository

  $cd minimalistic-storefront

3. Install dependencies

  $npm install

4. Run the app

  $npm start

Acknowledgements

• Design and endpoint by Scandiweb. The repo of the endpoint can be found here.

Contact

Built by @noszczykmichal - feel free to contact me!