Responsive web page using Bootstrap 5.3.3

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

I'm most proud of how I implemented a clean, responsive layout using Bootstrap 5.3.3 combined with vanilla JavaScript to create a fully functional and visually appealing REST Countries Explorer. The theme switcher that remembers the user's preference using localStorage is a nice touch that enhances the user experience.

If I were to do this project again, I’d also consider adding a detailed country view with more information like native name, time zones, borders, and currencies.

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

One of the challenges I faced was dynamically updating Bootstrap cards based on theme switching. Since Bootstrap doesn't provide built-in dark mode for cards, I had to manually toggle custom classes and handle the state consistently across theme changes.

Another challenge was efficiently filtering data based on both search and region selection in real time. I overcame this by combining the two filters in a single function and using event listeners for both input and select elements.

What specific areas of your project would you like help with?

Accessibility: What best practices could I apply to make this app more accessible?

Theme management: Are there better approaches to handle dark/light themes, especially using Bootstrap or CSS variables?

Optimization: Would lazy loading of flag images or pagination improve performance for large datasets?