REST Countries API with dark mode ft. React TS, Query, Router, Parcel

What are you most proud of, and what would you do differently next time?

I'm glad I gave this challenge another shot for the sake of learning. I implemented data fetching and caching with React Query, made general UX improvements, and even tried an awesome build tool called Parcel.

What challenges did you encounter, and how did you overcome them?

In my original solution, the theme flickers on page load from a blank white page, then to dark mode. This is because the logic for detecting the user's theme preference is located in the theme switcher component, so only after React is loaded does the theme kick in.

To solve this issue, I placed a script tag in the head tag which detects the user's theme preference and sets it as early as possible before styles are applied. Generally, blocking JavaScript is bad, but in this case the code is relatively small and greatly enhances UX, so it's a fair tradeoff.