Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Tip Calculator (Vanilla JavaScript)

P

@ralphvirtucio

Desktop design screenshot for the Tip calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I'm proud of completing this project using vanilla JavaScript. My goal is to enhance keyboard accessibility and screen reader compatibility so that every user can easily use my tip calculator application.

What challenges did you encounter, and how did you overcome them?

One challenge I faced was meeting the ETA I provided—still working on that one! 😅

What specific areas of your project would you like help with?

It would be great to get feedback on additional test cases for the inputs and the accessibility setup for the labels. Any insights on the event listeners I used would also be appreciated.

I'm also looking for suggestions on how to achieve the 4.27 tip amount shown in the provided desktop design. Currently, I'm using toFixed(2) for both the amount and total, which gives me a tip amount of 4.28.

Any feedback will be much appreciated, and you'll be rewarded with a virtual ☕🍩!

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord