https://github.com/darshanas17/cash-withdrawal-app-react
A React.js Cash Withdrawal App that allows users to withdraw money from a predefined balance using different denominations. The balance updates dynamically, ensuring a seamless user experience.
https://github.com/darshanas17/cash-withdrawal-app-react
css es6-modules html javascript reactjs state-management uiux
Last synced: 2 months ago
JSON representation
A React.js Cash Withdrawal App that allows users to withdraw money from a predefined balance using different denominations. The balance updates dynamically, ensuring a seamless user experience.
- Host: GitHub
- URL: https://github.com/darshanas17/cash-withdrawal-app-react
- Owner: Darshanas17
- Created: 2025-03-26T03:32:34.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-26T04:36:11.000Z (about 1 year ago)
- Last Synced: 2025-09-02T16:50:28.100Z (9 months ago)
- Topics: css, es6-modules, html, javascript, reactjs, state-management, uiux
- Language: JavaScript
- Homepage: https://darshanas17.github.io/Cash-Withdrawal-App-React/
- Size: 441 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Cash Withdrawal App
A React-based **Cash Withdrawal App** that allows users to withdraw money using predefined denominations while updating the available balance dynamically.
## 🚀 Live Demo
[Click Here to View the App](https://darshanas17.github.io/Cash-Withdrawal-App-React/)
## 📸 Preview
---
## 🎯 Features
- **Initial Balance:** Starts with **₹2000**
- **Withdraw Money:** Click on denomination buttons to deduct respective amounts
- **Denominations List:** Displays different withdrawal options
- **Dynamic Balance Update:** Reflects the remaining balance after withdrawal
---
## 🛠️ Installation & Setup
1. Clone the repository:
```sh
git clone https://github.com/Darshanas17/Cash-Withdrawal-App-React.git
cd cash-withdrawal-app
```
2. Install dependencies:
```sh
npm install
```
3. Run the application:
```sh
npm start
```
---
## 📝 Implementation Details
### **Technologies Used**
- React.js
- CSS (for styling)
- JavaScript (ES6+)
### **File Structure**
```
├── src
│ ├── components
│ │ ├── CashWithdrawal
│ │ │ ├── index.js
│ │ │ ├── index.css
│ │ ├── DenominationItem
│ │ │ ├── index.js
│ │ │ ├── index.css
│ ├── App.js
│ ├── index.js
├── package.json
```
---
## 🎮 How to Use?
1. View the **Current Balance** displayed at the top
2. Click on any denomination button to withdraw that amount
3. The **Remaining Balance** updates accordingly
4. Withdraw until the balance reaches ₹0
---
## 📂 Resources
### **Colors Used**
- `#150b3e` (Dark Purple)
- `#c7d2fe` (Light Blue)
- `#7c3aed` (Violet)
- `#d4d2db` (Grayish White)
- `#585076` (Muted Purple)
- `#382f5a` (Dark Violet)
- `#c4c4c4` (Light Gray)
---
## 📜 License
This project is licensed under the **MIT License**.
---
## 🤝 Contributing
Feel free to fork and contribute to this project.
1. Fork the repository
2. Create a new branch (`feature/your-feature`)
3. Commit your changes
4. Push to the branch
5. Open a Pull Request