Quiero compartir con los que No asistieron a mi último taller y con los visitantes del Blog de otros países los videos de una aplicación completa en ASP.NET MVC & JavaScript que tiene un 20% de código en el servidor (C#) y un 80% de código en el cliente (JavaScript).
Partes de la Aplicación
La aplicación es un Carrito de Compras que trabaja con la BD Northwind a la cual se le aumento la tabla de Usuarios asociados a cada Cliente (para el Login y ordenar el Pedido).
Esta consta de 4 vistas o páginas:
- Login: Esta página permite el ingreso de un usuario y su clave, mas un código de Captcha.
- Categorias: Página que lista las Categorías de Productos.
- Productos: Página que lista los Productos de una cierta Categoría y permite agregar una cantidad al Carrito y también ir a ver.
- Pedidos: Página que permite mostrar los pedidos y cambiar su cantidad o eliminar un producto del pedido. También permite grabar el pedido al cliente.
Características Técnicas
Este Carrito de Compras tiene las siguientes características:
- Los controladores están protegidos por un Filtro de Autenticación usando una Sesión para el Cliente, es decir no se puede ir a ningún controlador o vista sino te autenticas (Login).
- Todas las llamadas al servidor son asíncronas con XHR (No jQuery, No Angular, etc)
- Todos los datos enviados al cliente se serializan a CSV (No XML ni JSON que son mas grandes por tener metadata).
- El Login usa un Captcha y cifrado en el cliente con WebCryptoAPI (No Librerías Externas JS)
- Todas las imágenes vienen en un solo viaje (No Sprite sino Serializado en Conjunto).
- Los datos del pedido se almacenan en el cliente con SessionStorage (No Session en el servidor).
- La grabación de la cabecera detalle es muy rápida ya que se pasa una cadena desde el cliente hasta el servidor web y de datos consumiendo una sola conexión y ejecutando un solo comando.
Videos del Carrito de Compras
Carrito de Compras Parte 1
Carrito de Compras Parte 2
Carrito de Compras Parte 3
Carrito de Compras Parte 4
Comentario Final
Este Carrito de Compras es totalmente distinto al que ven en la mayoría de sitios web que enseñan ASP.NET, ya que tiene muy poco código y trabaja casi desconectado donde toda la funcionalidad se construye con JavaScript y es 100% asíncrono con XHR.
No es un Carrito de Compras tradicional, es un "Formula 1" pura Performance usando JavaScript nativo que se ejecuta en cualquier Browser moderno.
Lástima que solo unos pocos pudieron apreciar esta interesante demostración de un nuevo tipo de aplicaciones. Para los que están en Lima y se atreven a pedir el código fuente, la respuesta es "hubieras participado en el taller" y para los del exterior pronto veremos la forma de que estos cursos se hagan virtuales (primero vería si tienen demanda, para lo cual están sus comentarios).
