Skip to content
Submitted about 1 year ago

Tip calculator app

Brown Memoye•240
@memoye
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Tip calculator app
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

Please review my code, I'd like feedback on how I used useReducer and context API. Is there a better way I should have done it? Also, is my logic for calculating tips optimal, are there best practices I should have followed? Also look at the behavior of my inputs. Are they user-friendly.

I'd like as much feedback as I can get please.

Community feedback

  • Ayoub RABIE•430
    @AyoubrabiaePosted about 1 year ago

    Hi Brown,

    I've reviewed your code and the preview, and I must say, you're doing excellent work! The app functions very well, and I've picked up some neat tricks that I can apply to my own solutions 😅.

    However, there's just a small issue with the CSS that could enhance the overall design, which is crucial for a better user experience. I suggest removing the fixed width of 600px from your .container and allowing it to adapt to its content. Additionally, add the following styles to your .output div: width: 300px; min-width: 100%. This will ensure it looks great on desktop screens while taking up 100% of the width on mobile devices.

    That's it! I hope my suggestions are helpful to you.

    Marked as helpful
    1
    Brown Memoye•240
    @memoyePosted about 1 year ago

    Thank you, Ayoub. I appreciate your feedback and it makes me so happy that someone thinks I'm at least doing something right 😂. I'll be making the adjustments you pointed out ASAP to make the solution better. Much appreciated 🙂!

    1

Please log in to post a comment

Log in with GitHub

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