Master Signal Forms
Learn Angular's new Signal-based Forms API through 12 hands-on exercises. Each one includes starter code and a complete solution.
Why Signal Forms?
Native Signals Reactivity
Built on Angular's reactive primitives
Zero Boilerplate
No more FormGroup and FormControl complexity
Fully Type-Safe
Full TypeScript support with inferred types
Easy Migration
Migrate from Reactive Forms gradually
See the Workshop in Action
Each lab includes theory explanations and live coding walkthroughs.
Understand the Concepts
Each lab starts with focused theory so you understand why things work.
- check_circleClear concept explanations
- check_circleVisual diagrams and examples
- check_circleReal-world context and use cases
- check_circleAPI deep dives
Watch It Built Step-by-Step
See the complete solution coded live, then implement it yourself.
- check_circleStep-by-step implementation
- check_circleBest practices explained
- check_circleCommon mistakes avoided
- check_circleDebugging tips included
12 Hands-on Exercises
Learn by doing. Each exercise builds on the previous one.
Form Basics
Introduction to Signal Forms fundamentals. Learn how to create basic forms using the new Signal Forms API, understand the core concepts, and set up your first form with signal-driven reactivity.
Built-in Validators
Explore Angular's built-in validators in the context of Signal Forms. Learn how to apply common validation rules like required fields, min/max length, pattern matching, and email validation.
Custom Validators
Learn to create custom validators for Signal Forms. Implement business-specific validation logic, understand validator functions, and provide meaningful error messages.
Form Submission
Master form submission handling with Signal Forms. Learn how to process form data, handle submission states, implement submit buttons with proper disabled states.
Metadata
Understand and implement meta information in forms. Learn how to add and utilize metadata for form fields, implement field-level metadata.
Subforms & Form Arrays
Dive into nested forms and dynamic form arrays. Learn how to create complex form structures with nested form groups, implement dynamic lists of form controls.
Edit Forms
Implement edit functionality for existing data. Learn how to populate forms with existing values, handle update operations, manage form state during edits.
Data Mapping
Learn to map between form values and domain models. Understand how to transform form data to match your application's data structures and maintain clean separation.
Custom Form Controls
Build custom form controls that integrate seamlessly with Signal Forms. Learn how to create reusable form components that work with the Signal Forms API.
Legacy Migration
Learn how to integrate existing Angular Reactive Forms into Signal Forms. Migrate legacy forms gradually without rewriting all your validators and form logic at once.
Signal Forms Config
Configure Signal Forms globally using provideSignalFormsConfig. Enable CSS status classes for form styling and create custom class mappings for your design system.
Standard Schema
Integrate Standard Schema validation with Signal Forms. Generate schemas from backend API contracts and use them for frontend validation, ensuring consistency.
Start Your Signal Forms Journey
Get instant access to all 12 exercises with solutions and lifetime updates.
shopping_cartGet Full Workshop AccessHow the Workshop Works
Each lab includes starter code and complete solutions.
Learn by Doing
Each lab has an exercise folder with TODO comments and a solution folder with working code.
Start with exercises
Follow TODO comments to implement features
Build progressively
Each lab builds on previous concepts
Check solutions
Reference working code when stuck
Watch the walkthrough
Video explanations for each exercise
Who Is This For?
Meet the Author
Nivek
Google Developer Expert (GDE)
for Angular & Web Technologies
A trainer, consultant, and senior front-end engineer with a focus on the modern web, as well as a Google Developer Expert for Angular & Web technologies. He is deeply experienced in implementing, maintaining and improving applications and core libraries on behalf of big enterprises worldwide.
Kevin is forever expanding and sharing his knowledge. He maintains and contributes to multiple open-source projects and teaches modern web technologies on stage, in workshops, podcasts, videos and articles. He is a writer for various tech publications and was 2019’s most active Angular In-Depth publication writer.
58
Blog posts
2M+
Blog views
39
NPM packages
4M+
Downloaded packages
100+
Videos
15
Celebrated Champions League titles
Get Workshop Access
One-time purchase. Lifetime access. Free updates.
Enterprise
15 developer licenses
$2,000
- Everything in Individual
- 15 developer licenses
Individual
License for 1 person
$150
- Access to 12 chapters with theory & exercises
- Complete solutions included
- Theory + live coding videos
- Lifetime access
- Free updates
Live Workshop
In-person or remote
$3,500
CHF 3,500 in Switzerland. Price may vary based on your country.
mailContact Us- Everything in Enterprise
- Up to 15 attendees
- Full-day hands-on training
- In-person or remote delivery
- Live Q&A with instructor
FAQ
Questions? Get in touch.
You might also like
Explore more of our products
Build AI-Powered UIs with Angular
A practical, video-based course with 30+ snackable lessons that teaches you how to build AI-enhanced user interfaces in Angular. Learn streaming chats, tool calling, Gen UI, structured outputs, forms automation, charts from AI, and more.
ng-portfolio
A lightning-fast, fully customizable portfolio template for Angular developers. Deploy your professional portfolio in just 15 minutes with exceptional Lighthouse scores and an intuitive configuration system.
Angular Signals Masterclass eBook
Learn everything about the future of Angular with Angular Signals. In this comprehensive ebook, you will not only master the API and advanced concepts but also gain valuable insights into how this cutting-edge technology works behind the scenes. Elevate your development skills today and be at the forefront of real-time communication with Angular Signals!
Angular Enterprise Architecture eBook
Learn how to architect a new or existing enterprise grade Angular application with tooling based automated architecture validation.
This will ensure that Your project stays maintainable, extendable and therefore with high delivery velocity over the whole project lifetime!
Skol
Skol is the missing IDE scheme for all JetBrains products. It brings that Northern lights feeling straight to your IDE.
Omniboard - Enterprise Polyrepo Tooling
Omniboard is enterprise polyrepo management tool that helps you understand and evolve your codebases
ng-parsel
Parse your Angular code base to JSON - Great for displaying APIs and running custom analysis.
Angular UI components library starter
The custom Angular UI components library starter is a starter project to create, build, test, deliver and showcase your Angular component library. We collected all the best practices of building Angular libraries and put them together with state-of-the-art technologies into one epic starter kit.
Angularic Oh My Posh Theme
Angularic is a theme for Oh My Posh, a cross-shell prompt theming engine. It brings lots of infos relevant to Angular development packaged in a sleek and modern design.
Angular library starter
About Starter project to build epic Angular libraries with fully automated release setup, testing, linting, contribution guidelines, prettier, husky and more
Code tailor
Code tailor is a tool to create code snippets with syntax highlighting and export them as images.
Get in touch
Questions? We're happy to help!
Visit our service page or use the form below.
