A complete cash register application that calculates change due, determines the exact coins and bills to return, and manages cash drawer inventory.
- Calculates exact change needed
- Determines which bills and coins to return
- Displays current cash drawer status
- Shows different statuses (OPEN, CLOSED, INSUFFICIENT_FUNDS)
- Handles exact payment scenarios
- Keyboard support (Enter key)
This project was built as part of my learning journey with freeCodeCamp
- The item price is displayed ($1.87 in the example)
- Customer enters the amount of cash they provide
- Click "Purchase" or press Enter
- The application calculates:
- If customer has enough money
- Exact change due
- Which denominations to return from the drawer
- Current drawer status after transaction
| Denomination | Amount |
|---|---|
| PENNY | $1.01 |
| NICKEL | $2.05 |
| DIME | $3.10 |
| QUARTER | $4.25 |
| ONE | $90.00 |
| FIVE | $55.00 |
| TEN | $20.00 |
| TWENTY | $60.00 |
| ONE HUNDRED | $100.00 |
| Status | Description |
|---|---|
| OPEN | Change given, drawer still has funds |
| CLOSED | Change given, drawer is empty |
| INSUFFICIENT_FUNDS | Not enough change available |
- Exact cash: "No change due - customer paid with exact cash"
- More than price with sufficient funds: Shows OPEN status and change breakdown
- More than price with exact drawer amount: Shows CLOSED status
- More than price with insufficient drawer: Shows INSUFFICIENT_FUNDS
- Less than price: Alert message
- HTML5
- CSS3
- JavaScript
- Create a new folder on your computer
- Save the following files in that folder:
index.html(the HTML structure)styles.css(the styling)script.js(the JavaScript logic)
- Open
index.htmlin any modern web browser
cash-register/
├── index.html
├── styles.css
├── script.js
├── README.md
├── LICENSE
└── .gitignore
| Cash Provided | Result |
|---|---|
| $1.87 | No change due - exact cash |
| $2.00 | Status: OPEN QUARTER: $0.10 DIME: $0.02 PENNY: $0.01 |
| $5.00 | Status: OPEN ONE: $3.00 QUARTER: $0.12 DIME: $0.01 |
- Real-time price display
- Dynamic drawer inventory display
- Responsive grid layout for drawer items
- Input validation
- Keyboard Enter support
- Precise decimal calculations
Works on all modern browsers including:
- Google Chrome
- Mozilla Firefox
- Safari
- Microsoft Edge
You can modify:
pricevariable to change item costcidarray to change drawer inventory- CSS styles for different visual themes
MIT License - see the LICENSE file for details
This project was built as part of my learning journey with freeCodeCamp. The requirements and concept are based on their JavaScript Algorithms and Data Structures certification.