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 app - vanilla JS, SCSS

Qumrran 410

@qumrran

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?

A very cool task for practicing JavaScript, a bit of fun with the DOM, and a tip calculating function. Next time I will try to do it in React.

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

The problem I had was combining validation with tip calculation. I separated it into two separate event listeners, handling calculation on one side and calculating the tip on the other.

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

It bothers me that when I enter incorrect input, such as letters, I get NaN instead of an Error. I would prefer it to be an Error. I tried to solve it by setting textContent, but it didn't work because the validation likely occurred before the tip calculation function was executed.

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