Submitted almost 3 years ago

Learning JSON and Fetch API (vanilla js)

Benja.min•740

@BenjaDotMin

Preview site View code

This is a solution for...Time tracking dashboard

HTML
CSS
JS

2junior

Design comparison

SolutionDesign

Solution retrospective

Hello all! I decided to up the stakes and try my hand at a Junior level challenge.

Here I learned how to:

fetch data from a json file
use the data to populate the DOM content (vanilla js, no frameworks)
swap the content on click, driven by the available data

As always, any time spent is very much appreciated!

Community feedback

Neil Khatri•620
@nkhatri7Posted almost 3 years ago
This is really well done! The javascript code is really efficient and just done well overall. The design is also really good, the only thing I'd call out is when the screen width is between around 700px to 1000px, the period filters are too spread out. I think it would be better if you did justify-content: center and then spaced them out a bit with margin (but still keep them rather centralised). Other than that, I can't really fault your code and design, keep up the good work!
Marked as helpful
2
Benja.min•740
@BenjaDotMinPosted almost 3 years ago
@nkhatri7 Yep I had the same thought! Sadly those sizes are within tablet dimensions, so would be quite common to see it. But that could be a great way to fix it, thanks!

Thanks so much for the kind words, it helps!
0

Please log in to post a comment

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