Aplicación para ser presentanda en el taller de Angular y D3 el 29 de Agosto en la facultad de ingeniería de la universidad de Talca.
#Temáticas Abordadas
En este ejemplo explicamos que es un módulo para Angular y como lo unificamos con nuestro HTML. Luego explicaremos el concepto de Controlador y como este funciona como "pegamento" entre HTML y nuestra App. Hablaremos de las buenas prácticas respecto de Controller con la utilización de la sintáxis "controller as" y utilizaremos las directivas básicas: ng-app,ng-controller,ng-bind. Finalmente construiremos un "Hola mundo" al estilo Angular y explicaremos el concepto de two-way binding.
En esta segunda parte explicamos el porque de la integración de ui-router, el concepto de ruta, estado y como podemos manejarlos. Presentamos el concepto de "Configuración" de un módulo y el concepto de "Inyección de dependencias".
Integraremos diseño básico con Bootstrap y agregaremos un navbar. y lo exportaremos a una vista que estará presente durante toda la aplicación, paralelamente a los modulos de nuestra aplicación. Hablaremos de los estados anidados y de las vistas aboslutas con ui-router.
Diferencias entre Constant y Values, y para que nos sirven. Explicaremos que es un servicio como concepto y los dos tipos básicos "Service" y "Factory".
En esta parte explicamos lo importante que es el principio de responsabilidad unica (SRP), como dividir la estructura de nuestro proyecto y porque angular es un Framework que nos permite Testear nuestras aplicaciones. Luego al Servicio que ya habíamos construido lo conectaremos con nuestra API mediante el servicio nativo $http y explicaremos el concepto de CORS y que medidas a futuro debiera tomar nuestra aplicación. (Autenticación, Cookies, Caché , Etc. )
Integración de D3, Renderizar barras , agregar animaciones y agregar un nuevo módulo con un formulario
Agregaremos el formulario de votación utilizando las directivas ng-repeat y ng-click.
Finalmente explicaremos los principios básicos de D3, y como hacer un gráfico de barras y como exportamos este gráfico a una directiva reutilizable en cualquier parte de nuestra aplicación (y de otras aplicaciones Angular).
gpincheiraa