Tip Calculator App Using HTML CSS JS

Community feedback

• 

  P

  Nishanth Venkatesan•1,030

  @nishanth1596

  Posted about 2 months ago

  Hi @okhaled11, You've done a great job implementing the tip calculator using HTML, CSS, and JavaScript, it looks clean and functional. I really appreciate the effort you’ve put in. Here are a few friendly suggestions that could help polish the project further and bring it closer to a professional standard:

  1. Tagging: Since this project is built using plain HTML, CSS, and JS, tagging it as a React project might be a bit misleading. Updating the tags accordingly could help others find it more accurately.

  2. Documentation: Adding a short README or usage guide, even if minimal, makes a big difference. It signals that you care about code clarity and makes it easier for others to understand and test your work.

  3. Reset Button Behavior: Currently, the reset button calculates the result. Typically, a reset button is expected to clear all input fields and set values back to default. You might consider renaming it or adjusting the logic to match the label.

  4. Active Tip Highlight: There’s no visual indication of which tip percentage is selected, which can slightly impact the user experience. Adding an active class for the selected tip can help users better understand their selection at a glance.

  5. Semantic HTML: Using semantic tags like <header>, <main>, <section>, etc., instead of generic <div> elements, improves accessibility and SEO. For example:

  <header class="header">
    <span>SPLI</span>
    <span>TTER</span>
  </header>
  

  This gives better structure and meaning to your layout.

  Again, great work overall, you’re definitely on the right path. Keep coding and refining, and your projects will keep getting stronger!

  00