🌆 Instagram Photo Feed (con Bootstrap)

Proyecto realizado como parte del Bootcamp de 4Geeks Academy.
El objetivo es replicar un feed de fotos de Instagram utilizando HTML, CSS y Bootstrap 5, construyendo la estructura desde cero y aplicando los componentes básicos del framework: navbar, grid, modal y dropdown.

---

🧠 Objetivo del ejercicio

El propósito de este proyecto es que practiques:

• El uso del sistema de grid de Bootstrap.
• La integración de componentes de interfaz reutilizables.
• El trabajo con layout responsive.
• La comprensión de clases utilitarias (utilities/helpers) de Bootstrap.
• La estructura básica de un sitio web con HTML semántico y CSS limpio.

---

🧩 Componentes utilizados

1. Navbar

   • Con el logotipo (ícono de Instagram)
   • Botón “Create a new post” que abre un modal
   • Dropdown de ajustes (⚙️)

2. Grid de imágenes

   • Distribución en 3 columnas en pantallas medianas y grandes
   • Distribución en 1 columna en pantallas pequeñas
   • Imágenes cuadradas con object-fit: cover

3. Botón de alternancia de vista (toggle)

   • Permite cambiar entre 3 por fila y 1 por fila.

4. Modal funcional

   • Permite añadir una nueva publicación introduciendo una URL de imagen.

5. Accesibilidad

   • Se añadieron los atributos title y aria-label a los botones para evitar el error “Buttons must have discernible text”.

---

📂 Estructura del proyecto