Este proyecto es una solución al reto de Frontend Mentor: REST Countries API with color theme switcher.
La aplicación permite explorar información de todos los países usando la REST Countries API, con opciones de búsqueda, filtro por región y cambio de tema claro/oscuro.
La app muestra una lista de países con su bandera, nombre, población, región y capital.
Incluye:
- Búsqueda dinámica por nombre
- Filtro por región
- Cambio de tema (modo claro / modo oscuro)
- Diseño responsivo
El proyecto fue desarrollado usando Tailwind CSS para el diseño, jQuery para manipulación DOM y animaciones, y la API pública restcountries.com.
- HTML5 semántico
- Tailwind CSS
- JavaScript
- jQuery
- API REST (RestCountries)
- Responsive Design (Mobile First)
- Favicon e íconos en SVG
- Header: nombre del sitio y botón para cambiar entre light y dark mode
- Search bar: para buscar países por nombre
- Dropdown de regiones: filtro por continente
- Cards: con datos relevantes de cada país
- Modo Oscuro: cambia estilos dinámicamente
.
├── index.html
├── Js/
│ └── script.js
├── css/
│ └── output.css
├── assets/
│ ├── img/
│ │ └── favicon-32x32.png
│ └── svg/
│ └── moon.svg- Vista individual de país (detalle completo)
- Animaciones suaves al cambiar de tema
- Guardar modo preferido en localStorage
- Accesibilidad con ARIA y navegación con teclado
- Traducción de textos al español/inglés
Bryan14Saenz
“Programa no para resolver problemas, sino para crear soluciones.”
📧 Correo: 14bryansaenz@gmail.com
🌐 GitHub: github.com/Bryan14Saenz
🔗 LinkedIn: linkedin.com/in/14bryansaenz