Time Tracking Dashboard using ReactJS, and CSS Grid
Design comparison
Solution retrospective
This was my first Junior challenge and I had lots of fun! I decided to challenge myself and use react instead of just static HTML pages. I'd love to hear feedback on how I can improve in the future, thanks!
Community feedback
- @DarKaRorPosted over 2 years ago
Hey, that's pretty cool! I like your initiative, I decided to do the same as well now that I got to Junior
Maybe you just didn't try, but it'd have been nice to have a max-width in the cards instead of width, along with a width of 100% so it would resize when needed, and also maybe a transition between both of the viewports, but if you only wanted to make the designs given I totally get that!
The only thing that I belive I can suggest is to check your handleChildClick function since it seems to have a lot of repeated code. Lines 20 to 25 can be put into a function, if you want even more, you could give the function two parameters for the set functions (data.[type] and "day,week,month"). I also used and arrow function that calls the handleClick passing the type so that could also save you having to write each type by its own.
I really liked your active states and transitions! Keep it up
Marked as helpful1
Please log in to post a comment
Log in with GitHubJoin 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