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 Challenge using NextJs and Tailwindcss

Katherine Ebel• 180

@KatherineEbel

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


Any feedback welcome.

Community feedback

Martha• 510

@Mtc-21

Posted

greetings some recommendations:

  • make an effective validation of the fields, that indicates to the user a message with the errors.
  • do not allow data in negative, zeros to the left, the following 0123 is taken as a positive number
  • do not allow data like this 12-2
  • in the person field no decimals should be allowed in addition to the above
  • in the person field a number >100 should not be allowed in addition to the above
  • the number of persons should not be greater than the invoice number, invoice to 1 and persons to 50, does not make sense.
  • If you position over the field and delete the information, the totals should be reset according to what was entered in the field.

Marked as helpful

0

Katherine Ebel• 180

@KatherineEbel

Posted

@Mtc-21 Thanks for the feedback. I haven't had a chance to work on it yet, but definitely things I could improve

0

@molszewski34

Posted

Hey. Almost everything is fine. The only issue is found is that when you change custom input from any value to 0 it keeps old value when it should show default value mb. 5% ? It is not so important but keeps this project from perfection :)

Marked as helpful

0

Katherine Ebel• 180

@KatherineEbel

Posted

@molszewski34 Thank you! I wasn't allowing to set custom tip to zero at all. My code was converting 0 to false. I missed this. Now I have a test for it, so I think it is fixed!

0

@molszewski34

Posted

Yea. It is fine right now :)

0

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