HTML CSS JS API-call

Community feedback

• 

  Jean Chris•160

  @john-coderproPosted about 2 years ago

  hi dusan, congratulations for completing this challenge! here are some suggestions I can give to you:

  • I have noticed that once the user filters countries by region, there's no way to get back to all countries, think about adding an 'all' button

  • you can improve accessibility by making your interactive elements focusable ( like your countries cards, the filters country button ...), it can be done by giving them a tabindex of 0

  • think about using the right html element for the right purpose ( your toggle theme button for instance is a paragraph!, think about making it a button, which is even naturally focusable)

  • the countries' borders in your app are cca3 codes which is not very informative for the user, you can use this function to get the real names of the corresponding borders

  const getBordersNames = function (arrayOfBordersCca3Codes, countries) {
     if (arrayOfBordersCca3Codes) 
         return countries
             .filter((country) => arrayOfBordersCca3Codes.includes(country.cca3))
             .reduce(
                 (arrayOfBordersNames, currentObject) =>
                     arrayOfBordersNames.concat(currentObject.name.common),
                 []
             )
     else return null} 
  

  hope it helps

  0
• 

  kdiffin•40

  @diffimPosted about 2 years ago

  hey i noticed that the countries at first werent alphabetically ordered a way you can do this is by sorting the allcountries object with this

  .sort(function (a, b) {
      if (a.name.common < b.name.common) {
        return -1;
      }
      if (a.name.common > b.name.common) {
        return 1;
      }
      return 0;
    });
  

  0

  ---

  

  Dusan Madjar•120

  @Djarma12Posted about 2 years ago

  @diffim Hi, I didn't notice that it was asked for in the challenge.

  0

  

  kdiffin•40

  @diffimPosted about 2 years ago

  @Djarma12 oh yea i think it just makes the site look more pleasing and well collected overall

  0