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

Notification Page | Reactjs, hooks.

Desktop design screenshot for the Notifications page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi coders!

I was learning React and decide to use it in this challenge to keep practizing, also added a functionality for 'read' a notification clickin it. If you know React I'll be gratefull for some feedback!

Keep coding! cheers

Community feedback

@jhellard

Posted

Looking good! I'd suggest refactoring your handleCounter function to check if the message is read, it will continue to run even when the message is marked as read. Good use of useState, this is a good challenge for learning React for sure!

A fun challenge for this one I'd say is to make your data rendered dynamic, maybe pulling in from a .json file and mapping over it with your Notification component.

Keep on coding! ✌️

Marked as helpful

0

@Strocs

Posted

Hey @jhellard, tysm for that feedback, helps a lot to improve. I'll definitely do that refactoring, makes much more sense and will practising dynamic imports in my futures challenges!.

Cheers!

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