Bootcamp

www.talendig.com
 Bootcamp

Aprenderás paso a paso cómo desarrollar

aplicaciones web front-end con la nueva versión
de este framework de Google.

Angular es el framework para JavaScript estándar

para crear webs SPA. Es uno de los frameworks
más populares para desarrollar aplicaciones
modernas y escalables en el lado del cliente.

Si quieres ser desarrollador front-end o full-stack,

o incluso si ya te dedicas al desarrollo web, es casi
obligatorio aprender Angular.

www.talendig.com
 Bootcamp

En este Bootcamp aprenderás:

Aprende los conceptos, arquitectura y capacidades de una aplicación Angular.
Aprende a trabajar a fondo con los componentes.
Entiende como Angular se diferencia de otros web frameworks.
Usarás las nuevas características de ES6 y un lenguaje de tipados como TypeScript.
Desarrollar una aplicación desde cero usando Angular 13.
Explorar código y buenas prácticas en Angular.
Entender y usar formularios reactivos en Angular, Observables, Dependency Injection,
and Routing.

Realizar peticiones HTTP.

Aprende a crear los ficheros de distribución con Angular CLI, para publicar tu
aplicación, en github pages, Firebase hosting u otro Hosting.

www.talendig.com
 Bootcamp

¿Para quién es este bootcamp?

Desarrolladores web.
Estudiantes de informática.
Estudiantes de ingeniería o ciclos formativos.
Personas interesadas en el desarrollo web.
Interesados en el desarrollo front-end.
Interesados en el mundo de AngularJS y Angular.

Requisitos
HTML y CSS básico

JavaScript básico

NO es necesario saber nada de AngularJS,

Angular y tampoco de TypeScript

Duración Días de clases

40 horas en un mes Lunes a Viernes
5 clases semanales 3:00 pm. a 5:00 pm.

www.talendig.com
 Bootcamp

Módulo 1 Módulo 3
Presentación Curso Introducción Componentes
• ¿Qué aprenderás? • Creando app con Angular CLI
• ¿Qué es Angular? • ¿Qué es un componente?
• Instalaciones necesarias para • Creando un componente manualmente
empezar (NODE, VS Code, navegador) • Creando un componente con el CLI
• Anatomía de un Componente & Annotation

Módulo 2
PAngular CLI Módulo 4
• Instalar Angular CLI PAngular CLI
• Angular Extensiones para VS Code • Decorator @Component (metadata)
• Generando nuevo proyecto con Angular CLI • Templates Componentes
• Comandos más destacados Angular CLI • Inline / External
• Anatomía del proyecto - Styles Componentes
- Inline / External

• Ciclo de vida de un componente(Lifecycle

hooks)
• Componentes de orden superior (Higher Order
Components)
• Comunicación entre componentes @Input()
• @Outputs y EventEmitter
• Decoradores @ViewChild y @ViewChildren

www.talendig.com
 Bootcamp

Módulo 5 Módulo 7
Content Projection @HostBinding y @HostListener
(Proyección de contenido) • ¿Qué es el decorador @HostBinding?
• ¿Qué es la proyección de contenido? • ¿Qué es el decorador @HostListener?
• ¿Qué problema solventa la proyección
de contenido?
• ng-template, ng-container

Módulo 6 Módulo 8
Data Binding Directivas
• One-Way Data Binding {{ hola }} • ¿Qué es una Directiva?
• Two-Way Data Binding [(hola)] • Tipos de directivas
• Interpolation • Directivas estructurales
• Property Binding -NgIf
• Event Binding -NgFor
-NgSwitch
• Directivas de atributos
-NgClass
-NgStyle
-NgModel
• Creando directiva de atributo (Attribute directives)

www.talendig.com
 Bootcamp

Módulo 9 Módulo 11
Pipes Servicios e Inyección
• ¿Qué es un Pipe? de dependencias
• Pipes incorporados en Angular • ¿Qué es un service?
• UpperCase / LowerCase • ¿Qué es inyección de dependencias?
• SlicePipe / JsonPipe / AsyncPipe • Decorador @Injectable()
• Pipe puro / impuro • ProvideIn scopes : any, platform, root
• Creando nuestro propio Pipe • Creando un servicio con Angular CLI
• Implementando un Service

Módulo 10 Módulo 12
Formularios Reactivos Navegación y rutas
• ¿Qué es Reactive Forms? • ¿Cómo funcionan las rutas?

• FormGroup, FormControl • RouterModule.forRoot y RouterModule.forChild

• FormBuilder y FormArray • RouterOutlet, RouterLink, RouterLinkActive

• SetValue y patchValue • Rutas hijas

• Validaciones de Formularios • Parámetros en las rutas

• Validaciones customs • Guards

• Validaciones asíncronas (Async Validator) - CanActivate, CanDeactivate, CanLoad, CanActivateChild

• Reaccionando a cambios • Resolve

• Añadiendo Elementos dinámicos • Agrupación de Rutas y Component-less

• Lazy Loading

www.talendig.com
 Bootcamp

Módulo 13 Módulo 15
Intro a la programación Deployment
reactiva • Ng build con Angular CLI
• Introducción (Qué es la programación Reactiva, • Configurar archivo de environment
Beneficios) • Configurar el size budgets
• ¿Qué es RxJS? • Deploy en hosting / firebase
• ¿Qué es un Observable?
• Suscripciones
• Introducción a los Operadores (catchError)
• Subjects

Módulo 14
HTTP
• Introducción HttpClient
• Usando GET para recuperar data del servidor
• Usando POST y PUT
• Usando DELETE
• Manejando errors (catchError)
• Interceptors

www.talendig.com
809-908-3691
849-220-4934
info@talendig.com
www.talendig.com
@talendigrd
Talendig