- Desarrollo Web en Entorno Cliente - Prácticas
Repositorio de prácticas para el módulo de Desarrollo Web en Entorno Cliente.
* Gestor de presupuestos - primer trimestre
Durante el primer trimestre iremos creando una aplicación de manera iterativa. Dicha aplicación consiste en un gestor de presupuesto personal* en el que el usuario podrá ir anotando sus gastos de manera que pueda consultarlos y llevar un seguimiento de los mismos.
Para ello utilizaremos un único repositorio sobre el que iremos añadiendo nuevas funcionalidades cada semana.
De esta manera podremos ir estudiando los fundamentos del lenguaje JavaScript y las herramientas de desarrollo de cliente (/front end/) en el contexto de una aplicación real, donde la mayoría de código que vayamos creando tendrá una función y una utilidad específica dentro de dicha aplicación.
El proceso que llevaremos a cabo está enmarcado dentro del contexto educativo, por lo que no debe confundirse con el proceso real de creación de aplicaciones de carácter profesional. En ocasiones se propondrá la creación de varias versiones del mismo código utilizando técnicas distintas, o se tendrán que llevar a cabo rediseños o mejoras para ilustrar nuevos conceptos conforme los vayamos estudiando.
A grandes rasgos, los pasos que seguiremos para la elaboración de la aplicación serán los siguientes:
- Creación del código y las funciones necesarias para el funcionamiento de la lógica de la aplicación. En este punto la aplicación será una aplicación de consola que mostrará la información mediante texto plano.
- Creación de un interfaz web para mostrar la información de la aplicación en el navegador. En este punto podremos cargar nuestro código en el navegador web y ver los resultados en HTML.
- Añadir los controles de formulario necesarios para interactuar con la aplicación.
- Añadir mecanismos de validación para controlar la correcta introducción de datos por parte del usuario.
- Almacenar los datos de la aplicación en el navegador web. Desde este momento el usuario podrá guardar su información en el navegador: al recargar la página aparecerá la información que hubiera introducido (hasta este momento cada vez que se recargaba la página se borraban todos los datos).
- Conectarse con una API web para almacenar la información del usuario en un servidor web externo, incluyendo autenticación de usuario. De esta manera el usuario podrá acceder a sus datos desde cualquier navegador.
-
Utilizar librerías externas para mostrar determinada información de manera gráfica en lugar de texto exclusivamente.
A continuación se muestran los enlaces a los enunciados de cada una de las prácticas:
- [[./enunciados/introduccion_js.org][Introducción a JavaScript]]
- [[./enunciados/fundamentos_js_I.org][Fundamentos de JS I]]
- [[./enunciados/fundamentos_js_II.org][Fundamentos de JS II]]
- [[./enunciados/fundamentos_js_III.org][Fundamentos de JS III]]
- [[./enunciados/interaccionHTML.org][Interacción con HTML]]
- [[./enunciados/eventos.org][Eventos en JavaScript]]
- [[./enunciados/formularios.org][Formularios y JavaScript]]
- [[./enunciados/regexp.org][Expresiones regulares]]
- [[./enunciados/almacenamiento.org][Almacenamiento en el navegador]]
- [[./enunciados/async.org][Comunicación asíncrona]]
- [[./enunciados/librerias_externas.org][Librerías externas]]