React JS - Tip Calculator

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted over 2 years ago

  Hi Maikol, this looks like it was a good exercise for practicing how to use reducers and dispatch! Some notes:

  • I just got some comments about the use of initialState; I think in keeping with the design, it would be best to start with an empty state (even the design file is called "empty"); in this case I think placeholders are enough to show what needs to go into the input. In terms of user experience, it was a bit of work needing to delete the values before I input my own.

  • Also, just like you, at first I had also written my code in a way where empty values would give out the error message, but after looking at the design again, the message only appears if 0 is inputted, and it doesn't show in the empty state. It just make for a better user experience when they're not having red warning messages pop up unexpectedly as they're about to enter a number, which can be a bit jarring.

  • I tried typing in a letter and got NaN, but I wasn't able to type in anything else or delete it 😅

  • One more design comment: the font color of the input looks a bit like placeholder color text; I'd probably try making it darker.

  • Lastly, I see that you're using <input type=text>; have you tried <input type=number>?

  Once again, great work, hope to see more! 🙂

  Marked as helpful

  1

  ---

  

  Maikol hernandez•200

  @MaikolrmPosted over 2 years ago

  @elaineleung Wow that was beautiful. Thank you so much for your helpful comments and insides :)

  1