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 - HTML / CS / JS

BT738844 600

@BT453567

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?

Creating a useful and functional JavaScript app.

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

Initially I thought the app would be quite straight forward but there was more to code than initially expected. Important to plan how the code will be implemented.

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

The JavaScript code and how it might be improved.

Community feedback

@jjdavenport

Posted

The page looks excellent both on desktop and mobile, the html is easy to read and understand, to simpify your JS I would put the logical code for the calculations in functions and then add them to event listeners so they execute when you click or input numbers into one of the inputs. The only way the solution differs from the original is having no border-radius on the inputs.

Well done!

Marked as helpful

1
P
mrcordova 1,120

@mrcordova

Posted

Looks good, for the javascript you usually you want to use let instead of var as it prevents you from accessing the variable before it has been declared because var is hoisted to the top. And use const when you are getting values by reference like elements from your html and variables you aren't directly changing. Here is more info abour var.

Marked as helpful

1

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