Programa del Curso
Introduction
- What is Angular?
- Angular vs React vs Vue
- Overview of Angular 17 features and architecture
- Setting up the Development Environment
Getting Started
- Creating a new Angular 17 project using Angular CLI
- Exploring the project structure and files
- Running and serving the application
- Displaying data using interpolation and expressions
Components
- Understanding the role of components in Angular 17
- Creating and using components
- Passing data between components using inputs and outputs
- Using component lifecycle hooks
Directives
- Understanding the difference between structural and attribute directives
- Creating and using built-in directives such as ngIf, ngFor, ngSwitch, etc.
- Creating and using custom directives
Pipes
- Understanding the purpose of pipes in Angular 17
- Creating and using built-in pipes such as date, currency, json, etc.
- Creating and using custom pipes
Services
- Understanding the role of services in Angular 17
- Creating and using services
- Injecting dependencies using providers
Modules
- Understanding the role of modules in Angular 17
- Creating and using modules
- Importing and exporting modules
Data Binding
- Understanding the difference between one-way and two-way data binding
- Creating and using property binding, event binding, and banana-in-a-box syntax
- Using template reference variables
Routing
- Understanding the role of routing in Angular 17
- Creating and configuring routes
- Navigating between routes using routerLink and router.navigate()
- Using route parameters, query parameters, and fragments
Forms
- Understanding the difference between template-driven and reactive forms
- Creating and validating forms using form controls, form groups, form arrays, etc.
- Using built-in validators such as required, minLength, maxLength, etc.
- Creating and using custom validators
HTTP Client
- Understanding the role of HTTP client in Angular 17
- Creating and using HTTP requests to communicate with backend services
- Using observables to handle asynchronous data streams
- Using interceptors to modify or handle HTTP requests or responses
New, Declarative Control Flow
- Explaining the new template control block syntax and how it simplifies common tasks like conditional rendering, looping, and handling empty collections
- Giving examples of using the new blocks, such as @if, @else, @switch, @case, @default, @for, and @empty
- Comparing the new syntax with the previous one, such as *ngIf, *ngSwitch, and *ngFor
- Mentioning how the new control blocks support zoneless applications with signals
Deferred Loading Blocks
- Explaining the concept of deferred loading and how it can improve the performance and user experience of web applications
- Introducing the new @defer control block that enables lazy-loading of the block's content and its dependencies
- Giving examples of using the @defer block for different scenarios, such as loading components, directives, pipes, animations, and styles
- Mentioning how the @defer block works with the new view transitions API
View Transitions API
- Explaining the purpose and benefits of the view transitions API, which allows developers to customize the animations and transitions between views
- Introducing the new withViewTransitions directive that enables the use of the view transitions API
- Giving examples of using the withViewTransitions directive with different transition types, such as fade, slide, zoom, and flip
- Mentioning how the view transitions API works with the Angular router and the browser history
Other Features and Improvements
- Briefly summarizing some of the other features and improvements that Angular 17 offers, such as:
- Support for passing in @Component.styles as a string
- Angular's animations code is lazy-loadable
- TypeScript 5.2 support
- The core signal API is now stable
- Node.js v16 support has been removed and the minimum support version is v18.13.0
- Esbuild will be the default builder and the default dev server will use Vite
Summary and Next Steps
Requerimientos
- Comprensión de HTML, CSS y JavaScript
- Experiencia con TypeScript y RxJS
- Experiencia en desarrollo web
Audiencia
- Desarrolladores que deseen aprender a usar Angular 17 para crear aplicaciones web dinámicas y receptivas
- Desarrolladores que deseen mejorar sus habilidades de versiones anteriores de Angular
- Programadores que deseen explorar las nuevas características y mejoras de Angular 17
Testimonios (10)
The practical experience of actually working with the code
Chad Roskuge - ALTRON
Curso - AngularJS Basics
interesting showing the topic
Adam Boroch - SPOC S.A.
Curso - Angular JavaScript
The labs were interesting and probably the most useful learning tool to me. Anything I missed or forgot about was relearned or reinforced in the labs.
Joseph Fuerst
Curso - Building Web Apps using the MEAN stack
Me gustaron tus chistes
Dermot - Griffiths & Armour
Curso - Angular 2 Fundamentals
Traducción Automática
I mostly enjoyed the hands-on training code.
Tomislav Brajkovic - HSE - Healthlink
Curso - Angular 4: Create Single-Page Applications Using HTML, CSS and JavaScript
Análisis paso a paso. Explicación de cada línea de código. Todos los problemas que tuve durante el curso se resolvieron con éxito y Łukasz me dijo la razón. También me gustaron las buenas prácticas que se han presentado. Nunca me ha convencido el estilo TDD, simplemente no lo encuentro útil y no vale la pena. Łukasz señaló tantas ventajas de TDD que cambió completamente mi opinión.
Michał Uściński - Devapo Sp. z o. o.
Curso - Testing Angular Applications
Traducción Automática
część o RxJS
Kacper - INWEBIT Sp. z o.o.
Curso - Reactive Programming with Angular RxJS
I liked the communication and way of passing knowledge.
Marcin Wojdowski - PSI Polska Sp. z o.o.
Curso - Angular 5
Good material! The trainer is a really nice guy which helps a lot!
Xander Knol - Conclusion Learning Centers
Curso - Angular 6
Good examples and interactive course !