06/09/25

BITÁCORA TÉCNICA DE PROYECTO - SESIÓN #5

Desarrollo del Frontend y Depuración de Errores

Fecha: 06/09/25


Resumen del Día

En esta sesión se desarrolló la interfaz de usuario (frontend) de la aplicación web, implementando las pantallas para listar empleados y insertar nuevos registros. Además, se realizó una purga de errores para corregir problemas de conexión entre el frontend y el backend, y se validó el flujo completo de datos.


Detalle de Actividades

El trabajo de la jornada se centró en el desarrollo del frontend y la corrección de errores:

  1. Desarrollo de la interfaz de usuario:

    • Se creó la página principal con una tabla para mostrar la lista de empleados ordenados alfabéticamente.
    • Se implementó el formulario de inserción de empleados con validaciones en el frontend (campos obligatorios, formato de nombre y salario).
    • Se agregaron botones de "Insertar Empleado" y "Regresar" con la funcionalidad correspondiente para navegar entre vistas.

       2. Conexión con el backend:

    • Se implementaron las llamadas HTTP desde el frontend hacia los endpoints del backend.
    • Se configuró el manejo de respuestas exitosas y errores para mostrar mensajes al usuario.

       3. Purga de errores y pruebas:

    • Se corrigieron problemas de CORS que impedían la comunicación entre el frontend y el backend.
    • Se solucionaron errores de sintaxis en el código JavaScript y se validó el formato de datos enviados al backend.
    • Se probó el flujo completo: listar empleados, insertar un nuevo registro y verificar la actualización de la tabla.

       4. Optimización y documentación:

    • Se mejoró el estilo CSS para una presentación más clara y profesional de la interfaz.
    • Se documentaron los casos de prueba realizados para garantizar el funcionamiento correcto de la aplicación.

Resultado al Final del Día

  • La interfaz de usuario quedó completamente funcional, permitiendo listar empleados y insertar nuevos registros desde el navegador.
  • Se resolvieron los errores críticos de conexión entre frontend y backend, asegurando el flujo de datos sin interrupciones.
  • La aplicación web está lista para las pruebas finales y la entrega del proyecto.

Comentarios

Publicar un comentario

Entradas populares de este blog

05/09/25

BITÁCORA TÉCNICA DE PROYECTO - SESIÓN #4 Desarrollo del Backend y Módulos de la Aplicación Fecha: 05/09/25 Resumen del Día En esta sesión se avanzó en el desarrollo del backend de la aplicación, creando los módulos necesarios para la conexión con la base de datos y la implementación de la lógica de negocio. Se establecieron los endpoints básicos para la consulta e inserción de empleados. Detalle de Actividades El trabajo de la jornada se centró en la implementación del backend y la estructura de módulos: Investigación y configuración del entorno backend: Se seleccionó Node.js con Express.js como tecnología para el desarrollo del servidor. Se instalaron las dependencias necesarias.         2.  Conexión a base de datos: Se implementó el módulo de conexión a SQL Server usando el driver mssql.         3.  Desarrollo de módulos: Se creó el módulo para invocar el SP SP_Listar_Empleados y procesar los resultados. Se implementó el...
Leer más

07/09/25

BITÁCORA TÉCNICA DE PROYECTO - SESIÓN #6 Documentación Final y Cierre del Proyecto Fecha: 07/09/25 Resumen del Día En esta sesión se completó la documentación final del proyecto, incluyendo el análisis de resultados, la bitácora detallada y la organización del repositorio de GitHub. Se realizaron las últimas pruebas de funcionalidad y se preparó todo para la entrega del sistema. Detalle de Actividades El trabajo de la jornada se centró en la documentación y cierre del proyecto: Documentación del análisis de resultados: Se elaboró un documento formal con portada, índices de contenido y figuras, introducción y descripción del ambiente de desarrollo. Se incluyó una tabla de evaluación de requerimientos con el porcentaje de implementación y comentarios sobre el estado de cada elemento. Se recopilaron métricas del proyecto (horas trabajadas, líneas de código, tablas creadas, procedimientos almacenados, etc.).         2. Organización del repositorio de GitHub: Se...
Leer más