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

gatsby-rest-countries

@tannusesquerdo

Desktop design screenshot for the REST Countries API with color theme switcher coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
4advanced
View challenge

Design comparison


SolutionDesign

Community feedback

P
Matt Studdert 13,611

@mattstuddert

Posted

Awesome work on this Tannus! 👍

Nice to see you using this challenge to dive into some Gatsby as well. I only have a couple of very small suggestions:

  • In your index.js you're mixing the class method syntax with the arrow function syntax. This is leading to you having to .bind some methods in the constructor and not others. I would recommend just sticking with the arrow function syntax, as it means this is already bound to the class. That would also allow you to remove the constructor altogether and bring the state initialisation out of it, which would clean up your code a tiny bit.
  • At the moment you're using px units for a lot of your CSS. I would take a look into relative CSS units so that you can scale down your components for smaller screen sizes much easier. Here's a great article on building resizable components that might help.

Really great work with this. It looks awesome. Keep it up!

1

@tannusesquerdo

Posted

Thanks so much for your feedback, Matt. I'll take a look at the points that you suggested.

Looking forward to the next challenge. 🙌

Best.

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