SPA usando AngularJS



Esta publicación de blog es una breve introducción a la creación de un SPA con AngularJS. Intenta proporcionarle la información necesaria para incorporar componentes de SPA en aplicaciones.

En la actualidad, AngularJS se ha convertido en uno de los marcos de desarrollo más populares principalmente debido a su capacidad para ayudar a los desarrolladores a crear aplicaciones de página única (SPA) con facilidad. En las aplicaciones web tradicionales, el cliente (navegador) inicia un canal de comunicación con el servidor solicitando una página. El servidor responde procesando la solicitud y enviando el HTML de la página al cliente. Si el usuario solicita una nueva página, el servidor envía otra página HTML. Incluso si el cliente solicita un pequeño cambio, digamos un formulario con detalles básicos, el servidor tiene que cargar la página completa nuevamente y enviarla al cliente.

Solicitudes HTML y Ajax

En las aplicaciones de página única, toda la página se carga de una sola vez y el servidor realiza la comunicación posterior mediante solicitudes Ajax. El navegador tiene que actualizar solo la parte de la página que ha cambiado y no es necesario volver a cargar la página completa cada vez que un usuario realiza una nueva solicitud.
Dado que el enfoque de SPA reduce el tiempo que tarda el servidor en responder a las solicitudes de los usuarios, las aplicaciones web se ejecutan más rápido, utilizan menos potencia de cálculo y permiten a los desarrolladores de interfaz de usuario (UI) crear páginas web más atractivas y ágiles.





Creación de páginas Shell

La 'página única' en SPA se refiere a una página de shell que responde a consultas en forma de HTML, CSS o JavaScript. La página de shell se representa de forma asincrónica con el HTML, lo que elimina la necesidad de ir y venir al servidor. La página de shell solo necesita una referencia a la biblioteca de JavaScript de AngularJS y una directiva ng-view (un contenedor virtual que permite a los desarrolladores de UI cambiar entre vistas) para indicarle a AngularJS dónde se deben representar las páginas de contenido en la página de shell.
Dentro de la misma página 'única', AngularJS permite a los desarrolladores proporcionar múltiples vistas contenidas en la misma URL. Pueden aparecer diferentes conjuntos de vistas, una tras otra, dentro de la misma página de shell, y cada vista se carga dinámicamente a medida que el usuario se desplaza por la página.

SPA-using-AngularJS-multiple-views



La directiva AngularJS incorporada, ng-app, permite a los desarrolladores inicializar la aplicación, con la opción de agregar también directivas de terceros. La directiva ng-model, por otro lado, le permite agregar expresiones de enlace de datos en la memoria. Eche un vistazo aquí:

que hace la alerta en javascript

A nivel mundial, los desarrolladores han adoptado SPA utilizando AngularJS y, con toda probabilidad, se espera que esta tendencia dure un tiempo.



Tienes una pregunta para nosotros? Menciónalo en la sección de comentarios y nos comunicaremos contigo.

Artículos Relacionados: Carrera exitosa de desarrollo web con AngularJS