(SESIÓN 1)
Desde su sillón todo el mundo oirá, verá, participará,
incluso será capaz de aplaudir, dar ovaciones,
cantar en el coro, añadir sus gritos de
participación a los de todos los demás.
─Paul Otlet, 1934
Cuando Tim Berners-Lee publicó la primera página web a finales de 1990 en el CERN, la web era muy distinta a como la conocemos en la actualidad. Las páginas web sólo tenían texto. En los 31 años de historia de la web, el lenguaje de marcado o etiquetado que se emplea para crear las páginas web ha evolucionado poco a poco y se han ido desarrollando sucesivas versiones. A la versión inicial del lenguaje se añadieron nuevas características como las imágenes, las tablas o los marcos que permitían dividir las páginas web en varias partes. Las páginas web fueron evolucionando y cada vez contenían más imágenes. Los diseñadores gráficos se incorporaron al desarrollo de las páginas web y se desarrolló una nueva disciplina: el diseño web. Además, los navegadores web, cada vez eran más potentes y las conexiones Internet más rápidas, así que, las páginas web cada vez mostraban más información.
Durante los primeros cinco años la web sólo servía para leer, para consumir contenidos, no existía mucha interacción con las páginas web. Sin embargo, cuando se añadieron los formularios la web comenzó a cambiar. Los formularios permitían un mayor grado de interacción entre el usuario y las páginas web. Además, el lenguaje incorporó la posibilidad de añadir nuevos tipos de contenidos a las páginas web como audio, vídeo o animaciones y, los navegadores web se volvieron más rápidos y más potentes. Todo ello ayudó a que las páginas web se transformarán en aplicaciones web, en inglés, Web Apps, que permiten realizar a través de una página web las mismas tareas que tradicionalmente se realizaban mediante un software instalado en un ordenador a partir de un CD-ROM.
Hoy en día, a través de una página web podemos enviar correos electrónicos, podemos jugar, podemos editar fotografías, podemos ver vídeos o incluso, podemos editar los vídeos, todo ello a través de una página web.
En este curso te vamos a enseñar a crear páginas web. Las páginas web son el ejemplo más conocido de hipertexto e hipermedia pero existen otros sistemas que también se basan en estos dos conceptos.
¿Qué significa Front? Cuando hablamos de Front nos referimos a la parte de "en frente" de las aplicaciones web, la cual es la capa en la que interactuan los usuarios.
Esta es la parte que se visualiza en el navegador y es la que manda toda la información al Backend para ser procesada.
Cuando programamos en FrontEnd tenemos que estar conscientes de que todo lo que hacemos será lo que la persona al otro lado de la pantalla usará, y esta persona es en la que nos tenemos que enfocar.
Para eso existe el UI/UX, el cual se refiere a User Interface (Interfaz de usuario) y User experience (Experiencia de usuario), estas son las partes más importantes del diseño de una web, y SIEMPRE se tienen que realizar antes de empezar a programar.
El FrontEnd tiene muchísimos sabores y existen cientos de formas de hacer que tengas una página o aplicación web, y eso sin contar que también podríamos considerar como FrontEnd las aplicaciones móviles o de escritorio en toda su sección de interfaces.
Para el caso específico del taller estaremos utilizando 2 tecnologías, estas son: HTML y CSS.
Los Frameworks son variantes de JS que nos ayudan a que nuestra programación pueda llegar a ser mucho más rápida o con algunas funcionalidades adicionales a Vanilla JS, esto aplica tanto para FrontEnd como para Backend.
El hecho de que un Framework te permita programar de forma más sencilla NO SIGNIFICA que puedes saltarte toda la parte fundamental de JS, esto es porque al ser la base de muchos de los Frameworks web, es bastante útil conocer como funciona desde el fondo.
Existen muchos Frameworks y librerías muy famosos, pero por mencionar algunos de FrontEnd están React JS, Vue JS, Angular, Ember JS, Svelte, entre otros.
MVC (Model View Controller) Hablaremos de uno de los patrones de diseño web más utilizados y con el cual podremos tener muchísimo más claro el funcionamiento de todo el FrontEnd, la parte a la que nos referimos para el Front es la parte de la "Vista".
MVC se refiere a la separación de la interfaz de usuario (Vista) de la parte de datos y de negocio (Modelo), la cual está intermediada por un controlador (Controller); el controlador realiza las validaciones, sanitizaciones de datos, manejo de errores, entre varias otras cosas que permiten que los datos que se mandan desde la vista, lleguen de forma más ordenada y limpia a su procesamiento en el backend que es donde se encuentra el modelo.
Así como este patrón de diseño arquitectónico existen algunos otros como MVVM(Model View View Model), MVP (Model View Presenter), RMR (Resource Method Representation) y se recomienda que utilices el que sea mejor para tu aplicación.
El Ciclo de Vida del desarrollo de software es algo que debemos tomar en cuenta siempre que vayamos a hacer una aplicación, así sea un proyecto personal, un trabajo o cualquier momento en el que desarrollemos software.
En el SDLC tenemos las diferentes fases que harán que nuestro desarrollo sea mucho más controlado y sobre todo escalable y mantenible.
- Fase 1: Requerimientos --> Fase donde se presentan las necesidades de la aplicación.
- Fase 2: Diseño --> En esta fase los requerimientos se convierten en un plan y en lo que debería de parecer la aplicación o producto final.
- Fase 3: Desarrollo --> En esta fase se hace la programación de las aplicaciones, aquí es donde metemos el código con las mejores prácticas y con las reglas de las guías de desarrollo seguro.
- Fase 4: Verificación --> En esta fase revisarás y confirmarás que las buenas prácticas se aplicaron en el código. En esta parte se integran las pruebas de CI/CD e integración de pruebas unitarias.
- Fase 5: Mantenimiento y evaluación --> Los sistemas son un ente vivo y por lo tanto tiene que mantenerse en continuo movimiento.
//ESTRUCTURA DEL PROYECTO ABSTRACCION, ANALIZAR A DETALLE OBJETO,, RECONOCER CARACTERISTICAS ESCENCIALES, MODULARIDAD DISTINGUIR COMPONENTES, ENCAPSULAMIENTO TODO LO QUE NO ES RELEVANTE DE LA CLASE NO DEL OBJETO, VERBOS DE LO QUE PUEDE HACER, HERENCIA RELACION QUE EXISTE CON EL ANCESTRO, POLIMORFISMO OPERACIONES QUE PUEDEN SER APLICADAS AL OBJETO