Rest Countries API with color theme Switch Using REACT

Community feedback

• 

  MaorBezalel•340

  @MaorBezalelPosted about 1 year ago

  Hey Txrigxn,

  I too encountered a similar challenge when implementing the display of bordering countries for a specific country on its detailed page. Much like your experience, I found that relying solely on packages in this context often fell short, especially for certain countries.

  What I ended up doing was creating a separate object within my code, basically a map. Inside this map, I used the cca3 codes as keys and assigned the corresponding country names as values. It took a form like this in JavaScript:

  const cca3ToCountryName = {
    BEL: 'Belgium',
    CUB: 'Cuba',
    // etc'...
  };
  

  You can build this kind of map using the reduce method on the data fetched from the API, somewhat like this:

  const url = 'https://restcountries.com/v3.1/all?fields=name,cca3';
  
  fetch(url)
    .then(res => res.json())
    .then(data => {
      const cca3ToCountryName = data.reduce((acc, curr) => {
        acc[curr.cca3] = curr.name.common;
        return acc;
      }, {});
      return cca3ToCountryName;
    });
  

  Give this approach a try and see if it works for you.

  Marked as helpful

  1

  ---

  

  lenny-zanotelli•110

  @lenny-zanotelliPosted about 1 year ago

  @MaorBezalel Hello !

  Aaah I had seen something like this but I thought there would be another way to do it that was more “scalable” haha

  Anyway, thank you for your answer, I will follow your idea :)

  0