Quinta Entrada de la Bitácora (21/3/26)

Hora de Inicio: 3:36pm 21/3/26

Hora de Fin: 10:59pm 21/3/26

Cantidad de Horas Trabajadas:  Aproximadamente 5h 

La razón por la que las horas trabajadas no son exactas son debido a que en medio de el tiempo que estuve trabajando en la progra tuve que llevar a una compañera de mi apartamento a hacer las compras, por lo que tuve un pequeño "descanzo" el cual no cronometré adecuadamente.

 Hoy me di la tarea de crear la mayor parte de la interfaz gráfica requerida para la realización de la progra, aprovechando que anteriormente en Requerimientos de Software tuve que realizar una página web, por lo que estoy relativamente familiarizado con el tema. 

 Utilicé parte del código de la página ya existente como base, eliminando los elementos innecesarios para cumplir con la especificación dada por el profesor. Adjunto una imagen de la apariencia de la página de inicio de sesión de la progra anteriormente mencionada: 

 

Inicio de Sesión de un anterior proyecto

 

    Habiendo  eliminado parte del código tuve que recurir al video que originalmente utilicé como base para la creación de esta pantalla puesto que no recordaba cómo modificar correctamente algunos elementos de css: https://www.youtube.com/watch?v=hlwlM4a5rxg.

 Después de esto la mayor parte del tiempo pasé limpiando elementos innecesarios restantes, intentando solucionar algunos errores menores que aparecían, mejorando la documentación del código, buscando y eventualmente implementando una tabla la cual accede a los "valores de una Base de Datos"usando los siguientes foros: https://stackoverflow.com/questions/13595318/append-dynamically-created-table-javascript , https://www.geeksforgeeks.org/javascript/how-to-create-an-html-table-from-an-object-array-using-javascript/ e implementando unos valores "dummy"  los cuales imitan los que deberían estar presentes en la base de datos. 

 

Valores dummy para probar la funcionalidad de la BD 

 

Habiendo realizado esto conseguí que la página contara con la especificación del profesor y como un agregado estilístico logré ponerle el símbolo del colón costarricense (₡) a la columna de salarios. Realizando una comparación rápida me parece que se logró traducir el espíritu del dibujo realizado por el profesor en el diseño final:

 

 Esquema de la GUI #1

Diseño funcional de la GUI #1
 Esquema de la GUI #2

Diseño funcional de la GUI #2 
 
    Justo antes de terminar con lo relacionado a la GUI funcionando con normalidad sin querer eliminé parte del "header" de Html puesto que contaba con un ícono anteriormente y un poco de documentación, por lo que estaba siendo cargado "sin formato" por lo que estuve un tiempo buscando de dónde venía el error, aproveché para tomar una foto del estado de la página debido al error:
 
 
 

 Después de haber notificado a mi compañero con el progreso procedí a comer y por eso es que esta entrada de la bitácora fue realizada a altas horas de la noche. Seguidamente de la publicación de esta entrada pienso subir los archivos a GitHub.

Comentarios