https://github.com/alexandrabaturina/react-atm-exercise
React-based frontend for simple ATM app to withdraw or deposit cash to your bank account
https://github.com/alexandrabaturina/react-atm-exercise
form-validation react usestate-hook
Last synced: 2 months ago
JSON representation
React-based frontend for simple ATM app to withdraw or deposit cash to your bank account
- Host: GitHub
- URL: https://github.com/alexandrabaturina/react-atm-exercise
- Owner: alexandrabaturina
- Created: 2021-05-10T23:34:05.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2021-05-11T02:28:03.000Z (about 4 years ago)
- Last Synced: 2025-02-14T20:38:49.395Z (4 months ago)
- Topics: form-validation, react, usestate-hook
- Language: JavaScript
- Homepage:
- Size: 9.77 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ATM Machine
## Overview
***ATM Machine*** is a React-based fronend for ***ATM exercise*** built for MIT xPro [Front-End Development with React](https://executive-ed.xpro.mit.edu/front-end-development-react?utm_source=Google&utm_medium=c&utm_term=%2Bmit%20%2B%20react&utm_location=9033313&utm_campaign=B-365D_US_GG_SE_FREN_Brand&utm_content=MIT-Front-End-Development&gclid=Cj0KCQjwsqmEBhDiARIsANV8H3Y7VF1IsEfTGFApZ8oXItAFXl_Kjvnipt8rh6ji4XkwSCj-3m3z6tIaAnHGEALw_wcB) program. It is a very basic app to withdraw or deposit cash to your bank account.
The exercise has the following goals:
* Implement user-friendly UI and React components
* Manage state of various UI elements
* Validate form content in conjunction with state of other components
* Practice with **useState** React hook
## Features
The following improvements have been made to ***ATM Machine*** app:
* A multi-choice selection is provided instead of buttons to choose between Deposit/Cash Back modes
* UI is changed so that users have to select deposit or withdraw before an input field is visible
* The **number** input is validated so that the **Submit** button is disabled when you attempt to take out more money than is available in the account
## Getting Started
To run ***ATM Machine*** app locally,
1. Clone this repo.
2. ```cd``` into project directory.
3. Run ```standalone.html``` on local server.