In-house training
For your team only – remote or at your office, on dates that suit you, with examples from your own code base where it helps.
All trainings
Angular Basics & Essentials
Your developers build their first production-ready Angular features – with components, signals, forms, routing and tests from day one.
- 2 to 4 Days
- Beginner
- Remote or Inhouse
- German & English
Is this training right for your team?
Who it’s for
- Developers new to Angular
- Teams switching from React, Vue, AngularJS or server-side frameworks
- Backend developers who take over frontend work
Afterwards your team can
- Build standalone components, templates and forms on their own
- Load and show data with HttpClient, RxJS and signals
- Structure routing, services and dependency injection correctly
- Write first unit and end-to-end tests with Vitest and Playwright
Prerequisites
- Programming experience in any language
- Basic HTML, CSS and JavaScript
- Node.js and an editor installed – we send a checklist beforehand
Angular is big, and a team that learns it from blog posts picks up as many bad habits as good ones. In two to four days – depending on how deep you want to go – your developers learn the current way to build Angular applications – standalone components, signals, reactive forms, routing, HttpClient and RxJS – and why things are done this way.
Everything is live-coded and practised on your developers’ own machines. By the end the team has built a small but complete application, including tests with Vitest and Playwright, and knows how to continue in your project.
Agenda
The order and the depth of each block are adapted to your team – topics you already master are skipped, your questions get the time instead.
Angular Fundamentals
- Introduction to Angular and Modern Web Applications
- Standalone Components: Architecture and Advantages
- Change Detection: How It Works
- Basics of Control Flow in Angular
Components
- Creating and Structuring Standalone Components
- Understanding and Utilizing Lifecycle Hooks
- Inputs, Outputs, and Event Emitters for Data Sharing
- Components and Their Impact on Architecture
Templates, Data Binding, and Signals
- Property, Event, and Two-Way Binding in Templates
- Using Signals to Optimize Data Flows
- Control Flow in Angular Templates
- Performance Optimization with the OnPush Strategy
Component Communication
- Communication with Inputs and Outputs
- Shared Services for Reactive Data Management
- Signals for Cross-Component Communication
- Parent-Child Communication with ViewChild and ContentChild
HTTP Communication & Observables, RxJS
- Introduction to HttpClient for API Interactions
- CRUD Operations and Data Binding in Standalone Components
- Using Observables and Subscriptions
- Http Interceptors
- Using RxJS for Reactive HTTP Data Streams
Services, Dependency Injection, Pipes
- Creating and Using Angular Services
- Utilizing Dependency Injection
- Built-In and Custom Pipes for Data Formatting
- AsyncPipe vs Signals: Handling Data Streams
- Best Practices for Organizing Services
Forms and Validation
- Reactive Forms with Standalone Components
- Form Builder for Dynamic Form Creation
- Validation Logic: Built-In and Custom Validators
- Error Handling and Visual Feedback in Forms
- Integration with Backend Validations
Routing
- Standalone Components as Route Targets
- Lazy Loading Without Modules
- Router Guards: AuthGuard, CanActivate, CanDeactivate
- Passing Parameters in Routes and Query Strings
Testing (Vitest, Playwright)
- Unit Testing Standalone Components with Vitest
- Mocking Services and HTTP Calls
- End-to-End Testing with Playwright
- Strategies for Testing Dependency Injection
- Automation in CI/CD Pipelines
Your trainers
Tim Honermann
Senior Software Engineer
Senior Software Engineer for Angular and Java, builds full-stack applications for clients and writes about it on his blog.
Full profile →
Fabian Gosebrink
Microsoft MVP, Google Developer Expert
Builds Angular applications with teams every week and has given 120+ conference talks on Angular, state management and architecture.
Full profile →
“The training was excellent!”★★★★★
“Fabian has a very broad practical knowledge.”★★★★★
“You can clearly tell that Fabian works with Angular actively and professionally – he doesn’t "just" lecture about it!”★★★★★
“This was definitely one of the best trainings I have ever attended.”★★★★★
“We [...] could pull the updated code right in the course and try it out ourselves.”★★★★★
“Side notes and detailed explanations or repetition wherever necessary.”★★★★★
“Very well adapted to our needs.”★★★★★
“The NgRx concept was explained very well.”★★★★★
“Best course I have had so far.”★★★★★
“Although it was an advanced course, beginners could follow along well too.”★★★★★
Request a training
