Simple shopping cart prototype which shows how React components and Redux can be used to build a friendly user experience with instant visual updates and scalable code in e-commerce applications.

Overview

This simple shopping cart prototype shows how React components and Redux 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
  • Sort products by highest to lowest and lowest to highest price
  • Filter products by available sizes
  • Products persist in floating cart after page reloads
  • Unit tests, integration tests and e2e testing
  • Responsive design

Build/Run

Requirements

  • NODE
  • NPM
/* First, Install the needed packages */
npm install

/* Next make a build of react app */
npm run build

/* Then start both Node and React */
npm start

/* To run the tests */
npm run test

/* Running e2e tests */
npm run wdio

About tests

  • Unit tests
    • All components have at least a basic smoke test
  • Integration tests
    • Fetch product and add to cart properly
  • e2e
    • Webdriverio - Add and remove product from cart
You might also like...

This package will help parse OData strings (only the Microsoft Dataverse subset). It can be used as a validator, or you can build some javascript library which consumes the output of this library.

@albanian-xrm/dataverse-odata This package will help parse OData strings (only the Microsoft Dataverse subset). It can be used as a validator, or you

Oct 22, 2022

A prototype on how web3 technology can enable us to build an open, immutable, reproducible, and permanently accessible scientific record.

A prototype on how web3 technology can enable us to build an open, immutable, reproducible, and permanently accessible scientific record.

Web3 Research A prototype on how web3 technology can enable us to build an open, immutable, reproducible, and permanently accessible scientific record

Nov 27, 2022

In this project we made a Tv shows webpage where you can like or comment the different shows.

In this project we made a Tv shows webpage where you can like or comment the different shows.

JS Capstone Project In this project we made a Tv shows webpage where you can like or comment the differents shows. Built With HTML CSS JavaScript Lint

Mar 16, 2022

this is a single-page web application. we built a book website where the user can add , remove and display books. we used modules to implement these functionalities. also, we used the Date class to display the date and time.

Awsome Books In this Project, we have built A Books websites. Built With 🔨 HTML CSS javascript Git & Github Live Demo Here you can find the live Demo

Aug 3, 2022

An npm package for demonstration purposes using TypeScript to build for both the ECMAScript Module format (i.e. ESM or ES Module) and CommonJS Module format. It can be used in Node.js and browser applications.

An npm package for demonstration purposes using TypeScript to build for both the ECMAScript Module format (i.e. ESM or ES Module) and CommonJS Module format. It can be used in Node.js and browser applications.

Dec 28, 2022

Cornerstone is a set of JavaScript libraries that can be used to build web-based medical imaging applications.

Cornerstone is a set of JavaScript libraries that can be used to build web-based medical imaging applications. It provides a framework to build radiology applications such as the OHIF Viewer.

Dec 22, 2022

Food Delivery APP is a website designed to provide interactive user experience and increase user engagement when ordering food delivery.

Food-Delivery-APP Features Food Delivery APP is a website built with HTML/Tailwind CSS/JavaScript, React and enhanced with 3D design using Spline to p

Oct 6, 2022

🍭 search-buddy ultra lightweight javascript plugin that can help you create instant search and/or facilitate navigation between pages.

🍭 search-buddy ultra lightweight javascript plugin that can help you create instant search and/or facilitate navigation between pages.

🍭 search-buddy search-buddy is an open‑source ultra lightweight javascript plugin (* 1kb). It can help you create instant search and/or facilitate n

Jun 16, 2022

A native, pure and exquisite web components library which can be used anywhere.

A native, pure and exquisite web components library which can be used anywhere.

What Is This ? This is a project on pure web components merely using native HTML、CSS and JavaScript technologies. It has features below: based on web

Nov 16, 2022
Owner
Ivan Kuznietsov
Ivan Kuznietsov
A minimal e-commerce store using Gatsby, SANITY, Stripe, Use-Shopping-Cart and Netlify

?? Gatsby Starter Stripemart Like a supermarket but for Stripe. No ongoing monthly costs. Perfect for artists, creators and independent builders doing

Eric Howey 26 Nov 14, 2022
This is an imitation of the Amazon online shopping store. Users can add and remove items from the cart, proceed to checkout and make payments.

AMAZON This is an imitation of the Amazon online shopping store. Users can add and remove items from the cart, proceed to checkout and make payments.

Kevv_in 7 Mar 23, 2022
Shopping cart built with React

Shopping Cart In this project, I performed operations such as listing products, adding products to the cart and removing products from the cart, which

Efecan Pınar 6 Jun 17, 2021
Shopping Cart - Project of HTML, CSS, and JavaScript developed by me (Raphael Martins) at the end of the Unit 9 Module 1 of the Web Development course at Trybe

Project of HTML, CSS, and JavaScript developed by me (Raphael Martins) at the end of the Unit 9 Module 1 of the Web Development course at Trybe. I was approved with 100% of the mandatory and optional requirements met.

Raphael Martins 13 Nov 27, 2022
Toolkit for building scalable web applications with TypeScript, React, Redux and Apollo-Client

TsToolbox Toolkit for building scalable web applications with TypeScript, React, Redux and Apollo-Client (inspired by ReKit) ⚠ ⚠ ⚠ Work in Progress ⚠

Daniel Nikravesh 7 Apr 14, 2022
A live instant messaging app that translates user messages into the other user's preferred language.

BabelFish Description BabelFish is an interactive multi-person chat app with built in live translation. It is created using the MERN stack (MongoDB, E

Jamel 3 Jul 18, 2022
A dashboard for managing orders and inventory for a wordpress e-commerce site which has woo commerce plugin installed

WordPressWooCommerceDashboard - A dashboard for managing orders and inventory for a wordpress e-commerce site which has woo commerce plugin installed. This program provides shipping tracking for Delhivery.

Vikrama Reddy 1 Jan 3, 2022
Snippets4Dummies is an easy to use Visual Code Extension which is used for building beautiful layouts as fast as your crush rejects you!

Why Snippets4Dummies? Snippets4Dummies is an easy to use Visual Code Extension which is used for building beautiful layouts as fast as your crush reje

SCHWITZ 6 Oct 11, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022