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

REACT HOOKS PRACTICE

P

@simokitkat

Desktop design screenshot for the Age calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


One of the best Challenges to test our hooks. I used useState, useEffect, useRef, useContext and useReducer hooks in this application. I even managed to create my own custom hook afterwards to refactor some of the code.

I'd appreciate any feedback on how I can improve at React in order to be a better programmer.

Community feedback

Steve 1,170

@peanutbutterjlly

Posted

hey 👋,

your app looks a functions BEAUTIFULLY.

I think your code looks well written/slick too! organized nicely, reads well, etc.

if I had to nitpick, I'd remove all the commented code from src/App.jsx (lines 22-75); and on your inputs (placeholders for 'DD', 'MM', 'YYYY') I'd remove the top padding to center those placeholders.

Those are TINY criticisms (and I think your solution is overall better than mines) - you did amazing on this.

keep up the good work!

1

P

@simokitkat

Posted

@peanutbutterjlly

Thank you for your kind words. In fact I kept these comments because I wasn't sure I'd manage to cut a big chunk of the logic in App.jsx to my custom hook, But it seems to have worked.

About the placeholders I agree with you and honestly I'd have preferred if the app was centered in the mobile version too, but according to the design it seems that it isn't, but thank you for noticing and writing about that.

1
Steve 1,170

@peanutbutterjlly

Posted

@simokitkat

ah ok, definitely nothing wrong with keeping that commented code in there - it was only a minor suggestion to remove it. it doesn't affect performance or negatively impact the site at all.

I had to look DEEP to find something 'bad' with your code, as it's overall great in my honest opinion and my criticisms were tiny at best.

once again, good work 👍

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