REST Countries API with color theme switcher using Vanilla JavaScript

Hi there. You did a good job 😎

keep improving your programming skills🛠️

your solution looks great, however, if you want to improve it, you can follow these steps:

• It would also be great to show a spinner when the page loads, or to display country loading messages

• instead of duplicating variables, you could create a base address and add paths. And it is better to make them constants, because you do not change them.

let baseApiLink = "https://restcountries.com/v2/all";
let regionQuery = `https://restcountries.com/v2/region/`;
let nameQuery = `https://restcountries.com/v2/name/`;
let alphaQuery = `https://restcountries.com/v2/alpha/`;

• Code duplicating

   if (light) {
      darkMode(switchBtnText, switchBtnIcon);
      light = false;
    } else {
      lightMode(switchBtnText, switchBtnIcon);
      light = true;
    }

• One of the possible optimization methods:

      darkMode(switchBtnText, switchBtnIcon);
      light = !light;

• It is also better to optimize the function to enable themes:

function chanegMode(text, icon, mode) {
  let iconClasses = `fa-regular theme-icon ${mode === 'dark' ? 'fa-sun-bright' : 'fa-moon'}`;
  text.textContent = mode === 'dark' ? 'light mode' : 'dark mode';
  icon.className = iconClasses;
 mode === 'dark' 
 ? document.body.classList.add("dark-theme")
: document.body.classList.remove("dark-theme")
}

I hope my feedback will be helpful. You can mark it as useful if so 👍

Good luck and fun coding 🤝⌨️