Lección: 56 Configurar FULLCALENDAR sin morir en el intento en el SISTEMA VETERINARIO (PHP y MySql) FullStack

56 Configurar FULLCALENDAR sin morir en el intento en el SISTEMA VETERINARIO (PHP y MySql) FullStack

Duración: 9 min

Módulo: 📅 Desarrollo del Módulo de Reservas con FullCalendar Lección 2 de 9

Descripción

🎬 Lección 56: Configuración de FullCalendar en el Sistema Veterinario ⚙️

El objetivo de esta lección es explorar y aplicar diversas configuraciones de FullCalendar para hacer que el calendario sea funcional y adecuado para la reserva de citas.

1. Exploración y Vistas de FullCalendar

El instructor demuestra la versatilidad de la librería al cambiar entre diferentes modos de visualización disponibles:

Vista por Tiempo (DayGrid Time): Permite ver las horas del día, adecuada para programar citas. [01:34]
Vista por Meses del Año (Year View): Muestra los 12 meses del año en una sola pantalla. [03:03]

2. Personalización del Calendario

Se aplican dos configuraciones esenciales en el script de inicialización de FullCalendar:

Configuración	Propósito	Resultado
initialView	Establece la vista por defecto, volviendo a la vista de dayGridMonth (la vista de calendario mensual tradicional). [06:55]	Muestra el mes actual con días en una cuadrícula.
locale: 'es'	Configura el idioma de la interfaz del calendario. [04:18]	Nombres de meses, días y botones se traducen al español.

3. Manejo de Eventos Estáticos

Antes de la conexión con MySQL, se explica cómo FullCalendar renderiza los eventos (citas) utilizando una estructura de datos JSON (o un arreglo de JavaScript) de forma estática:

Estructura del Evento: Cada cita se define como un objeto con un title (título/descripción del evento), una fecha de start (inicio) y, opcionalmente, una fecha de end (fin). [06:18]
Ejemplo de Cita: Se crea un evento de prueba estático, por ejemplo: "Reserva con el Doctor Ruiz" con un rango horario específico (ej. 10:00 a 11:00) para el día 25 de septiembre. [07:34]
Importancia: Se resalta que esta estructura estática es el mismo formato que se deberá generar dinámicamente desde la base de datos más adelante. El objetivo es que, si un horario ya está reservado, el sistema no permita agendar otra cita en ese mismo espacio. [08:32]

El instructor concluye, indicando que el siguiente paso será crear la tabla en la base de datos para almacenar las citas y luego conectar el calendario a esta información de manera dinámica. [08:49]

Hilari Web