Angular JS 1.5 - nanforiberica

A lo largo de este curso, aprenderemos sobre las características del framework Angular.js de Google, más concretamente de las versiones de la familia 1.x, comenzando por la última release que tenemos ahora mismo, la 1.5.


Comenzaremos con un repaso rápido sobre cómo Javascript afecta al DOM (es decir, el “esqueleto” de la página web), cambiando los elementos HTML y el estilado CSS. Tras este repaso básico, nos adentraremos en los primeros pasos para utilizar Angular, y ya pasar a meternos a fondo con esta interesante herramienta.


El software requerido para este curso, es el siguiente:
 Servidor web HTTP (En este caso usaremos un servidor en Node.js)  IDE o editor de textos avanzado. Recomendado Sublime Text 3.  Package Control para ST3, con el que instalaremos el plugin AngularJS 1.0 para ayudarnos en la creación de código.  Framework de Angular.js, versión 1.5 o superior preferiblemente.

 

Contenido del curso

 

Introducción al curso

Instalación de todos los programas y configuraciones necesarias.

Ver la documentación adjunta para obtener los links de descarga.

Preparando el ambiente de trabajo

 

AngularJS : Primeros pasos

 

Ser ordenado no es opcional, es necesario.. ustedes mismos se lo agradecerán después.

Organizando nuestro proyecto

Creando nuestra primera aplicación en AngularJS

Hola Mundo

Los filtros son una poderosa herramienta que angular nos brinda para que no tengamos que escribir nada de código.

Filtros - Filters

Utilización de la directiva "ng-model" en nuestro "Hola Mundo" para explicar diversos usos de la misma.

Directiva: ng-model

Evaluar los conocimientos aprendidos hasta el momento

Evaluación - Angular 101

Aquí esta la solución del ejercicio anterior

Resolución de la Evaluación - Angular 101

 

Angular 111: App, Controlers y Scope

 

Aquí comenzaremos a entrar en materia de AngularJS y sus principales componentes.

Directivas App y Controller: Parte 1

Vista previa

Editando en tiempo real el contenido y sugerencias para mejorar mejorar la apariencia.

Directivas App y Controller: Parte 2

Breve descripción del Bootstrap. .

Sobrevolando Bootstrap

Dos nuevas directivas bastante útiles para ocultar ó mostrar secciones.

El ng-hide, es exactamente igual al ng-show, solo que en lugar de mostrar cuando la condición es verdadera, ocultara la información cuando la condición del ng-hide sea verdadera.

Los invito a que lo prueben.

ng-hide / ng-show

Una manera sumamente fácil y practica de animar las cosas.

Animaciones - animate.css

Esta evaluación es para que afiances los conocimientos adquiridos. Cualquier duda, volver a revisar las clases.

Reforzando conocimientos

 

Angular Intermedio: Filtros, Repeticiones y data desde archivos

Manejar repeticiones dependiendo de una lista de datos.

ng-repeat : Parte 1

Entrando un poco más en materia de la directiva ng-repeat

ng-repeat : Parte 2

Aplicar concepto de búsquedas por nombre o por algún criterio, nunca ha sido más fácil.

Filtros al ng-repeat

Después de esta clase, podrán ordenar datos en objetos y arreglos.

OrderBy - En filtros y ng-repeat

La manera adecuada para llenar campos select.

ng-options

Probaremos lo asimilado en la sección 4 de esta clase.

Repeticiones

 

Data desde archivos externos

 

Angular actualizó la forma en la que trabaja el HTTP, (módulo que veremos a continuación), en los ejemplos que adjunto, ya les paso una versión de angular un poco más vieja.

 

Actualización del Módulo HTTP version de AngularJS 1.6 o superior

Al final de la clase, podrán obtener data de otros archivos y comprender el problema "Cross origin"

$http - request

Hacer esta clase, únicamente si estas trabajando en el sistema operativo OSx

Instalando XAMPP en OSX

Hacer esta clase, únicamente si estas trabajando en el sistema operativo Windows.

Instalando XAMPP en Windows

Crear accesos directos para trabajar más cómodamente.

Accesos Directos a HTDocs

Para trabajar simplificar páginas web

ng-include

Usaremos un API (Application Programming Interface), para obtener información relacionada a nuestra ubicación actual para obtener datos de la ciudad, el país y otros datos de interés.

Detectando IPs, Pais, Ciudad y demás información Online

API (Application Programming Interface), usaremos una API externa para crear nuestra propia detección del clima dinámicamente

Api Externa - Clima en el Mundo

Reforzar conocimientos aprendidos en la sección

Data Externa

 

Sitios Dinámicos - Responsive Sites

 

Esta presentación le ayudara a comprender qué es lo que haremos y por qué lo haremos. Se explicara páginas tradicionales y paginas dinámicas.

Introducción a los sitios dinámicos

Información importante en los cambios del Router en la version 1.6.X, favor tomar nota.

Actualización en Angular router 1.6.X o superior

Inicio de movimientos entre páginas sin refresh del navegador web.

ng-route

Se explicará como crear nuevos controladores y llamar funciones del controlador principal desde controladores hijos.

Agregando Controladores desde el archivo de configuración.

Empezaremos a utilizar MySQL. Preparando una base de datos para nuestro programa.

Preparando nuestra base de datos

En esta clase crearemos un filtro personalizado y leeremos la data de la tabla alumnos para llenar una HTML Table.

Creando nuestra primera tabla dinámica y filtro personalizado

Aquí veremos cómo manejar los registros de la tabla.

Tabla dinámica parte 2

 

Route Params, Navegación y Posteos

Enviaremos parametros por URL a otro controlador, para llenar información del Alumno

RouteParams - Parametros de Ruta

Aprenderemos como crear mascaras de teléfonos y parametrizando mascaras.

ui-mask : Mascaras para tus campos de texto

Haciendo UPDATE directamente la base de datos desde nuestro programa.

Haciendo Posteo de información - Guardar datos via Ajax

Ejecutar una inserción a la base de datos utilizando la misma pantalla de actualización

Insertar en base de datos

Agregando iconos a nuestros botones y páginas.

Font-Awesome

Angular 2

Setup

Quickstart

Templates and Components

Services

Update Angular 2 and Node

Routing

Pipes

 

Customer Reviews

Based on 1 review Write a review
€695.00