Mostrar eventos desde la DB por hora y Salas [SOLUCIONADO]

Desplegando Agenda de Eventos por Horario y Sala con PHP y MySQL

Para muchos desarrolladores, ofrecer una experiencia intuitiva a los usuarios donde puedan visualizar la lista de eventos programados segmentados por sala y horario resulta ser un aspecto crucial. En este artículo, vamos a explorar cómo podemos lograr dicha funcionalidad utilizando el lenguaje de programación PHP en combinación con una base de datos MySQL.

Antes de empezar, es nivel esencial tener conocimientos de PHP y manejo de bases de datos con MySQL. Asimismo, es importante tener una comprensión de cómo se estructuran las consultas SQL y cómo PHP se puede conectar y interactuar con MySQL.

Preparando la Base de Datos

El primer paso para exhibir los eventos por sala y hora es crear una estructura de base de datos adecuada que pueda almacenar la información requerida de forma óptima. Suponiendo que contamos con una base de datos llamada eventos_db, la tabla eventos podría estructurarse de la siguiente manera:

<button class="margin-js" onclick="copyPreContent(this)">Copiar</button>
CREATE TABLE `eventos` (
    `id` INT(11) NOT NULL AUTO_INCREMENT,
    `titulo` VARCHAR(255) NOT NULL,
    `descripcion` TEXT,
    `fecha` DATE NOT NULL,
    `hora_inicio` TIME NOT NULL,
    `hora_fin` TIME,
    `sala` VARCHAR(50),
    PRIMARY KEY (`id`)
);

Una vez creada la tabla, el siguiente paso es insertar algunos datos para poder trabajar con ellos:

<button class="margin-js" onclick="copyPreContent(this)">Copiar</button>
INSERT INTO `eventos` (`titulo`, `descripcion`, `fecha`, `hora_inicio`, `hora_fin`, `sala`) VALUES
('Evento de desarrollo web', 'Técnicas avanzadas en HTML y CSS', '2023-04-01', '10:00', '12:00', 'Sala Alfa'),
('Seminario de PHP', 'Profundizando en Laravel y Symfony', '2023-04-01', '12:30', '14:30', 'Sala Beta'),
('Workshop de JavaScript', 'ReactJS: Desde cero hasta avanzado', '2023-04-02', '10:00', '12:00', 'Sala Alfa');

Conectando PHP con MySQL

El segundo paso es establecer una conexión entre PHP y MySQL. Para lograr esto, generalmente se utiliza la extensión PDO (PHP Data Objects) o MySQLi. En este caso, utilizaremos PDO por su facilidad y la capacidad de trabajar con diferentes gestores de bases de datos:

<button class="margin-js" onclick="copyPreContent(this)">Copiar</button>
<?php
try {
    $conn = new PDO('mysql:host=localhost;dbname=eventos_db', 'usuario', 'contraseña');
    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage();
}
?>

Con la conexión establecida, estamos listos para realizar las consultas SQL necesarias para recuperar los eventos.

Consultando y Mostrando la Lista de Eventos

Para mostrar los eventos, la consulta SQL debe obtener la información y ordenarla según la fecha y el horario, además de agruparla por sala. A continuación se muestra el código PHP con la consulta SQL correspondiente:

<button class="margin-js" onclick="copyPreContent(this)">Copiar</buttons>
<?php
$query = "SELECT * FROM `eventos` ORDER BY `fecha`, `hora_inicio`, `sala` ASC";
try {
    $stmt = $conn->prepare($query);
    $stmt->execute();

    $eventos = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch(PDOException $e) {
    echo 'ERROR: ' . $e->getMessage();
}
?>

Una vez que hemos recuperado los datos en la variable $eventos, podemos continuar con el proceso de mostrarla al usuario. Es importante estructurar la información de manera que sea fácil de comprender. Para ello, se puede iterar a través del arreglo de eventos y agruparlos visualmente por sala y horario en la presentación del calendario de eventos:

<button class="margin-js" onclick="copyPreContent(this)">Copiar</button>
<?php
$currentDate = '';
$currentSala = '';
foreach ($eventos as $evento) {
    if ($currentDate != $evento['fecha'] || $currentSala != $evento['sala']) {
        if ($currentDate != '') echo '</ul>';
        echo '<h2>' . date('d-m-Y', strtotime($evento['fecha'])) . ' - Sala ' . $evento['sala'] . '</h2>';
        echo '<ul>';
        $currentDate = $evento['fecha'];
        $currentSala = $evento['siggala'];
    }
    echo '<li>' . date('H:i', strtotime($evento['hora_inicio'])) . ' - ' . $evento['titulo'] . '</li>';
}
echo '</ul>';
?>

Con un bucle foreach, se presenta la lista de eventos correspondientes. Se utiliza la variable $currentDate y $currentSunga para detectar cuando se cambia de fecha o de sala, y así poder generar un nuevo encabezado para el grupo de eventos.

Consejos para Mejorar la Interfaz de Usuario

Con la funcionalidad básica en su lugar, podemos mejorar la experiencia del usuario aplicando estilos CSS y quizá algún framework como Bootstrap para un diseño más atractivo. Además, JavaScript puede ser utilizado para añadir interactividad, como la posibilidad de filtrar eventos por sala o fecha.

Optimizando la Performance y Seguridad

Este artículo se ha enfocado en la parte funcional de mostrar eventos por hora y sala, sin embargo, optimizar la base de código para mejorar el rendimiento y la seguridad es una tarea igualmente importante. Algunos tips a tener en cuenta son:

  • Utilizar declaraciones preparadas para prevenir inyecciones SQL.
  • Limitar la cantidad de datos a mostrar utilizando Paginación o Lazy Loading, si la lista de eventos es muy extensa.
  • Implementar mecanismos de caching para reducir la carga sobre la base de datos.

Al seguir estas recomendaciones y aplicarlas a su código, no solo se obtendrá una aplicación de eventos robusta y confiable, sino que también ofrecerá una mejor experiencia al usuario y un sistema más seguro.

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad