diff --git a/Projects/1-Beginner/Tip-Calculator-App.md b/Projects/1-Beginner/Tip-Calculator-App.md new file mode 100644 index 00000000..a4c7b16e --- /dev/null +++ b/Projects/1-Beginner/Tip-Calculator-App.md @@ -0,0 +1,30 @@ +# Tip Calculator + +**Tier:** 1-Beginner + +Calculate a tip and total bill based on the bill amount, tip percentage, and number of people splitting the bill. This is a classic starter project to practice numeric input handling and basic UI updates. + +## User Stories + +- [ ] User can enter the bill amount +- [ ] User can select a tip percentage (e.g., 5%, 10%, 15%, 20%, custom) +- [ ] User can enter number of people to split the bill +- [ ] User sees calculated tip amount and total per person update instantly +- [ ] User sees input validation errors for non-numeric or negative values + +## Bonus features + +- [ ] Add preset percentage buttons and a custom percentage input +- [ ] Persist last used values in local storage +- [ ] Format currency based on locale +- [ ] Keyboard-only accessibility and screen reader friendly labels + +## Useful links and resources + +- [Number() – MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) +- [Intl.NumberFormat – MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat) + +## Example projects + +- [Build a Tip Calculator (YouTube)](https://www.youtube.com/results?search_query=tip+calculator+javascript) + diff --git a/README.md b/README.md index 317d3092..0a30056b 100644 --- a/README.md +++ b/README.md @@ -78,6 +78,7 @@ required to complete them. | [Wind Chill](./Projects/1-Beginner/Windchill-App.md) | Calculate the windchill factor from an actual temperature | 1-Beginner | | [Word Frequency](./Projects/1-Beginner/Word-Frequency-App.md) | Calculate word frequency in a block of text | 1-Beginner | | [Weather App](./Projects/1-Beginner/Weather-App.md) | Get the temperature, weather condition of a city. | 1-Beginner | +| [Tip Calculator](./Projects/1-Beginner/Tip-Calculator-App.md) | Calculate tip/total per person for a bill | 1-Beginner | ### Tier-2: Intermediate Projects