Skip to content
Submitted over 1 year ago

REST Countries API(Vite + React JS + React Router + SCSS + leaflet)

mohamed yasser amer•610
@mohamedyasser27
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...REST Countries API with color theme switcher
  • HTML
  • CSS
  • JS
  • API
4advanced

Design comparison

SolutionDesign

Solution retrospective

I found that implementing a reusable dark theme hook to be challenging, particularly when it came to utilizing SCSS. After much experimentation, I discovered a mixin that generated CSS custom properties, which helped me overcome this hurdle.

also, while developing functions to manipulate the country data, I realized that I wasn't entirely confident about the way I had written the code. I felt that I could benefit from some guidance on best practices in this area.

I would like to learn more about the recommended approaches to structuring project folders and ensuring accessibility. By implementing best practices in these areas, I hope to create cleaner, more efficient, and more scalable projects in the future.

i also want to know your opinion on the whole project responsive design.

Community feedback

  • Emmanuel Daniel•1,170
    @coderdanniePosted over 1 year ago

    Hello Congrats on the completion of this project. You did a great Job. My suggestion is as follows

    1. While data is still been fetched from the API, before the data arrives, you can render loading spinner or something of a simple text like 'loading...' just to make your app more user friendly in terms of users experience.
    2. Also you can as well handle errors in a more obvious manner. Right now if I should input a country that doesn't exist, it doesn't just display anything. It seems blank. You can implement a ui error as well like ' no country found for your query". You can as well check my solution so see the suggestions I made. I also implement this suggestions https://rest-countries-coderdannie.netlify.app/ Overall you did a great job Happy coding
    Marked as helpful
    1
    mohamed yasser amer•610
    @mohamedyasser27Posted over 1 year ago

    @coderdannie thanks a lot for your suggestions , i will work on them

    0

Please log in to post a comment

Log in with GitHub

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