Skip to content

🎰 Vending Machine frontend app build with React, Material UI, Redux and React Router - Abacum React Course Summer 2023

Notifications You must be signed in to change notification settings

andugu/vending-machine

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

79 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

🎰 Vending Machine

This project replicates the front end of a vending machine using React, Material UI, Redux and React Router. It also includes a mocked BE build with json-server.

πŸ› Architecture

/src
β”œβ”€β”€ /components             # React FC components
β”œβ”€β”€ /mocks                  # A mocked BE powered by json-server
β”œβ”€β”€ /pages                  # Page entrypoints for the app
β”œβ”€β”€ /redux                  # Redux store sclices
β”œβ”€β”€ /App.*                  # App files
β”œβ”€β”€ /api.ts                 # Handles all the interactions with BE
β”œβ”€β”€ /store.tsx              # Redux store
└── /types.tsx              # Interfaces definition

πŸ“Έ Screens

Login screen

Screenshot 2023-07-26 at 14 05 06

Products screen

Screenshot 2023-07-26 at 14 07 18

πŸ“œ Available Scripts

πŸ›« npm start

To start the application.

πŸ§ͺ npm test

To launch the test runner in the interactive watch mode.

πŸ₯Έ node src/mocks/server.js

To start a mocked backend json-server for testing purposes.

About

🎰 Vending Machine frontend app build with React, Material UI, Redux and React Router - Abacum React Course Summer 2023

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published