Aula ServiWeb GARZA

Diseño de Aplicaciones Web: Sitios Web del Lado del Cliente

Resumen

El diseño de aplicaciones web del lado del cliente se centra en construir interfaces interactivas, ágiles y visualmente atractivas con las que los usuarios interactúan directamente en el navegador. Utiliza tecnologías como HTML, CSS, JavaScript, y frameworks modernos para crear aplicaciones dinámicas y responsivas que funcionan sin recargar la página completa, mejorando la experiencia del usuario.

Herramientas y Tecnologías Básicas

1. HTML (Hypertext Markup Language): Proporciona la estructura del contenido, como encabezados, párrafos, imágenes, y formularios.
2. CSS (Cascading Style Sheets): Controla la apariencia del contenido, aplicando estilos como colores, fuentes, márgenes, y diseños flexibles para que las páginas sean visualmente atractivas.
3. JavaScript: Añade interactividad y dinamismo a la aplicación web, permitiendo la manipulación de elementos en tiempo real, validaciones de formularios, animaciones y la gestión del estado de la página.
4. Frameworks/Librerías:
   • Angular: Un potente framework desarrollado por Google que facilita la creación de aplicaciones de una sola página (SPA). Permite organizar el código en componentes reutilizables y facilita la gestión del estado de la aplicación y la interacción con APIs externas.
   • React.js: Una biblioteca de JavaScript enfocada en la creación de interfaces de usuario mediante componentes reutilizables.
   • Vue.js: Un framework progresivo para construir interfaces de usuario con una curva de aprendizaje más suave.
   • Bootstrap/Tailwind CSS: Frameworks CSS que ayudan a construir interfaces responsivas rápidamente mediante estilos predefinidos y componentes.
5. Herramientas de Desarrollo:
   • Visual Studio Code: Un editor de código ligero con extensiones para facilitar el desarrollo web y la depuración de código.
   • Chrome DevTools: Herramientas del navegador Chrome que permiten depurar, analizar y optimizar las aplicaciones web directamente desde el navegador.

---

Desarrollo de Aplicaciones Híbridas con Android, iOS y Progressive Web Apps

Resumen

El desarrollo de aplicaciones híbridas implica la creación de aplicaciones que pueden ejecutarse en múltiples plataformas (Android, iOS, PWA) con un único código base escrito en tecnologías web. Esto permite ahorrar tiempo y esfuerzo en el desarrollo, ofreciendo una experiencia similar a la de aplicaciones nativas. Progressive Web Apps (PWA) son aplicaciones web mejoradas que funcionan como aplicaciones móviles, pero no requieren instalación desde una tienda de aplicaciones.

Herramientas y Tecnologías Básicas

1. Angular con Ionic Framework: Combina Angular, un framework robusto de JavaScript, con Ionic para crear aplicaciones móviles híbridas y progresivas (PWA). Ionic facilita el desarrollo de aplicaciones móviles utilizando tecnologías web (HTML, CSS, JavaScript), mientras que Angular proporciona la arquitectura y organización necesarias para manejar grandes aplicaciones.
2. Capacitor: Un runtime de código abierto para Ionic que permite acceder a las APIs nativas del dispositivo (cámara, GPS, almacenamiento) en las aplicaciones híbridas sin necesidad de usar diferentes lenguajes de programación nativos.
3. Cordova: Proporciona un puente para acceder a funcionalidades nativas del dispositivo mediante JavaScript, aunque Capacitor se utiliza cada vez más en lugar de Cordova en aplicaciones modernas.
4. Progressive Web Apps (PWA):
   • Service Workers: Son scripts que corren en segundo plano y permiten a las PWAs funcionar sin conexión y cargar rápidamente.
   • Manifest.json: Archivo que define cómo se comporta una PWA cuando se instala en la pantalla de inicio del dispositivo, proporcionando una experiencia similar a una aplicación nativa.
5. Herramientas de Desarrollo:
   • Angular CLI: Herramienta de línea de comandos que facilita la creación y gestión de proyectos Angular, incluyendo el scaffolding de componentes y servicios, así como la compilación y el testing.
   • Android Studio: IDE oficial para desarrollar aplicaciones Android, que incluye emuladores de dispositivos.
   • Xcode: IDE oficial para desarrollar aplicaciones iOS y realizar despliegues en dispositivos de Apple.
   • Firebase: Servicio en la nube que proporciona autenticación, almacenamiento, bases de datos en tiempo real, y notificaciones push, útil para integrar funciones backend tanto en PWAs como en aplicaciones móviles híbridas.