Please enable JavaScript.
Coggle requires JavaScript to display documents.
Introducción a las aplicaciones web - Coggle Diagram
Introducción a las aplicaciones web
Arquitectura de las aplicaciones web
Definición
Forma en que se estructura y comunica una app web
Componentes básicos
•Cliente
-Navegador
-Interpreta HTML, CSS y JavaScript
•Servidor web
-Maneja peticiones HTTP
-Apache, Nginx
•Servidor de aplicación
-Lógica del negocio
-PHP, Node.js, Python
•Base de datos
-Almacenamiento de información
-MySQL, PostgreSQL, MongoDB
•Cliente – Servidor
•Tres capas
-Presentación
-Lógica de negocio
-Datos
•MVC
-Modelo
-Vista
-Controlador
•SPA
-Carga una sola página
-Actualización dinámica
-React, Angular, Vue
•Microservicios
-Servicios independientes
-Comunicación por API
-Escalabilidad
Evolución de las aplicaciones web
Etapas
Web 1.0 (años 90)
• Sitios estáticos
•Sin interacción
•HTML básico
Ejemplo: páginas informativas
Web 2.0 (2000s)
•Contenido dinámico
•Interacción y colaboración
•Uso de AJAX y bases de datos
Ejemplos: Wikipedia, YouTube, Facebook
Ejemplos: Wikipedia, YouTube, Facebook
Web 3.0 (2010–2020)
Aplicaciones inteligentes
Uso de APIs y nube
Servicios conectados
Ejemplos: Google Drive, Spotify Web
Web 4.0 y actual (2020–2026)
Inteligencia artificial
Personalización
PWA
Asistentes inteligentes
Tecnologías para el desarrollo web
•Frontend
-HTML5
-CSS3
-JavaScript
-Frameworks
React
Vue.js
Angular
Svelte
•Backend
-Bases de datos
MySQL
PostgreSQL
MongoDB
Redis
-Frameworks
Laravel
Express
FastAPI
-Lenguajes
PHP
Python
Java
JavaScript
Ruby
Go
Rust
•Otras herramientas
APIs REST
GraphQL
Servidores web
Git y GitHub
Docker
•Servicios en la nube
AWS
Azure
Google Cloud
•Ejemplo
-App de reservas de hotel
React
Node.js + Express
MongoDB
AWS
Docker
Planificación de aplicaciones web
•Importancia
-Evita errores
-Mejora calidad y seguridad
Etapas
1- Análisis de requisitos
-Funciones
-Datos
-Flujo del sistema
2- Diseño
-Diagramas
-Arquitectura
-UI / UX
3- Desarrollo
-Programación
-Buenas prácticas
4- Pruebas
-Funcionalidad
-Seguridad
5- Despliegue
-Servidor
-Nube
6- Mantenimiento
-Monitoreo
-Actualizaciones
-Optimización