Semana 4 SPA vs MPA

1. SPA VS MPA
Mg. Richard E. Mendoza G.

3. https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296

4. Estos son los 12 perfiles
mejor pagados para
desarrolladores
https://www.enter.co/especiales/dev/empleos-
dev/estos-son-los-12-perfiles-mejor-pagados-para-
desarrolladores/

6. 6
• El enfoque clásico es aquel en el que los
clientes solicitan páginas y el servidor las
construye en cada petición. Este enfoque
es denominado por muchos muchos
como “Page Redraw” o “Multipage
Application”. Aunque hoy en día, también
estas webs con este enfoque tienden a
apoyarse en peticiones ajax tratando de
hacer el contenido más dinámico y
agilizando la carga y experiencia de
usuario creando un modelo híbridoX.
Entre las ventajas para SEO y existen
recursos y herramientas que permiten
medir analíticas webs y haciendo un
desarrollo mas controlado.
Multi Page App

7. 7
• Una web SPA o single page application
se refiere a una forma de desarrollo
web en la que la página web está
contenida en un único archivo. De esta
forma, se carga todo en HTML y,
mientras naveguemos por la página, irá
solicitando el contenido al servidor via
ajax. Es decir, todo el contenido html,
css y javascript de la página web al
completo se carga una primera vez y
nada más. De esta forma se mejoran
los tiempos de respuesta y, por
consiguiente, la experiencia de usuario.
Simple Page App

8. Single Page App Multi Page App

9. 9
• Se tratan de aplicaciones fáciles de
desarrollar, desplegar y depurar. Al
contar con infinitos frameworks y
librerías, será muy sencillo de
desarrollar.
• Nos muestran el contenido de forma
sencilla y elegante al cargar todo el
contenido en una única página.
• Además, ejecutando la lógica del lado
del navegador, hace que las
interacciones del usuario se ejecuten
más rápido.
VENTAJAS DE LAS SPA
• La analítica de la web es mucho mas
sencilla puesto que solo analiza una
única página.
• También facilitará el SEM puesto que
todas las llamadas y posibilidades de
interacción se realizarán en una única
página.
• Muy útiles para la creación de páginas
de aterrizaje. ¿Sabes qué es una
landing page?

10. 10
• El SEO no es tan fácil como en una
MPA, aunque esto es cada vez más
sencillo de optimizar y no supone
tanto problema como hace un tiempo.
• En sitios muy grandes, el
mantenimiento del código puede ser
algo complicado y hay que tener
desde el principio muy clara la
estructura de la página.
DESVENTAJAS DE LAS SPA
• Al tener el código fuente
directamente en el navegador, si no
seguimos buenas prácticas, la
seguridad del sitio se podría ver
expuesta.
• Aunque las SPA son muy rápidas, al
cargar la página por primera vez de
forma completa, esto hace que esta
carga sea algo lenta, lo que puede
ahuyentar posibles clientes. De todos
modos, actualmente, hay métodos
para mejorar esta velocidad de carga,
que veremos en otro post.

11. 11
• Compass es una herramienta muy
completa para usar el lenguaje MQL de
una manera muy cómoda. Visualización
de databases, colecciones, documentos,
todo muy visual, muy vistoso y con
muchas opciones. Tanto si estás
aprendiendo, como si ya controlas, esta
herramienta es en mi opinión, obligatoria.
Para todos los sistemas operativos.
• Esta aplicación está disponible para
plataformas Mac y Windows, y para
entornos de escritorio Linux.
MONGO COMPASS

13. products = [ { id: '1', image:
'assets/images/camiseta.png', title: 'Camiseta',
price: 80000, description: 'bla bla bla bla bla' }, {
id: '2', image: 'assets/images/hoodie.png', title:
'Hoodie', price: 80000, description: 'bla bla bla bla
bla' }, { id: '3', image: 'assets/images/mug.png',
title: 'Mug', price: 80000, description: 'bla bla bla
bla bla' }, { id: '4', image: 'assets/images/pin.png',
title: 'Pin', price: 80000, description: 'bla bla bla bla
bla' }, { id: '5', image: 'assets/images/stickers1.png',
title: 'Stickers', price: 80000, description: 'bla bla
bla bla bla' }, { id: '6', image:
'assets/images/stickers2.png', title: 'Stickers', price:
80000, description: 'bla bla bla bla bla' } ];

14. https://www.navicat.com/en/products/navicat-for-mongodb