31 Como listar los archivos de la BD en las carpetas en el curso de LARAVEL (PHP y MySql) FullStack

Duración: 8 min
Módulo: 📄 Listado y Visualización de Archivos Lección 2 de 7

Descripción

📊 Lección 31: Cómo Listar los Archivos de la BD en las Carpetas

Este capítulo se centra en mejorar la presentación visual de los archivos que fueron cargados y registrados en la base de datos en las lecciones anteriores. El instructor decide reemplazar la simple lista por una tabla estructurada para ofrecer una mejor experiencia de usuario y preparar el terreno para futuras funcionalidades (como acciones y filtrado).

🖥️ Implementación de la Tabla (Bootstrap)

Para listar los archivos de una manera más organizada, se reemplaza el listado sencillo por una tabla HTML con estilos de Bootstrap para darle un aspecto moderno:

  • Estructura de la Tabla: Se definen las columnas (<thead>) para mostrar la información clave de cada archivo [01:50]:
    • Nº: El número de fila.
    • Nombre: El nombre del archivo.
    • Fecha: La fecha y hora de creación.
    • Acciones: Espacio reservado para botones (compartir, descargar, eliminar).
  • Bucle y Datos (<tbody>): Dentro del cuerpo de la tabla se itera con un bucle @foreach sobre la colección de $archivos que se cargó desde la base de datos [02:42].
  • Contador: Se declara una variable $contador que se incrementa en cada fila para mostrar el número de registro en la tabla [03:13].
  • Campos Mostrados: Se muestra la información del archivo en las celdas de la tabla:
    • {{ $archivo->nombre }}: Muestra el nombre único del archivo [04:45].
    • {{ $archivo->created_at }}: Muestra la fecha de subida del archivo [05:07].
  • Clases de Estilo: Se aplican varias clases de Bootstrap a la tabla para mejorar su apariencia y funcionalidad [04:04]:
    • table: Estilo base.
    • table-responsive: Asegura que la tabla se adapte a dispositivos móviles.
    • table-hover: Resalta la fila al pasar el ratón sobre ella.
    • table-striped: Alterna el color de las filas.

💡 Próximo Paso: Iconografía

El instructor finaliza el capítulo planteando la necesidad de mostrar un icono representativo junto al nombre del archivo (similar a un gestor de archivos real) [06:29]. Para esto, será necesario analizar la extensión del archivo (ej. .pdf, .jpg, .doc) a partir de la cadena de texto del nombre, lo cual será el tema del siguiente video [08:09].