🛍️ Simple ecommerce cart application

Basic Overview - Live Demo

✈️ Follow Jeremy Akeze

This simple shopping cart prototype shows how React with Typescript, React hooks, react Context and Styled Components can be used to build a friendly user experience with instant visual updates and scaleable code in ecommerce applications.

Features

• Add and remove products from the floating cart using Context Api
• Filter products by available sizes using Context Api
• Responsive design

Build/Run

Requirements

• Node.js
• NPM

/* First, Install the needed packages */
npm install

/* Then start the React app */
npm start

/* To run the tests */
npm run test

Copyright and license

The MIT License (MIT). Please see License File for more information.

_{A little project by Jefferson Ribeiro}

How to run API and UI Tests

Both API and UI tests are in the Cypress folder.

• npm ci (root folder)
• cd Tests
• npm ci
• npm run start (run server in first bash terminal on VS code)
• npx cypress open (using Cypress GUI) in the second bash terminal on VS Code, npx cypressstay in Tests folder, Choose E2E Testing, Electron, and then spec to run
• npx cypress run (run both API and UI tests on CLI)
• npm run cy:api (just to run API)

How to run docker command

Make sure Docker Desktop is up-running if you have a Windows machine In the root folder, enter below command: docker-compose -f Tests/docker-compose.yml up

How to run GitHub Action

There is a workflow file for API in .github folder Go to Repo, click Actions, click "Cypress Api Testing Regression", select Run workflow on right, keep Main branch, Click Run workflow.