Angular Intensive I: Workshop Outline

Duration: 1 Day
Level: Beginner
Format: Resident Human Online with Hands-on Workshop


Event Schedule

Topic 1: Angular Fundamentals & Standalone Components
Break
Topic 2: Data Binding & Component Communication
Break
Topic 3: Routing & Building Your First Angular App
Wrap-up & Next Steps


Event Description

Jumpstart your journey into modern web development with Angular Intensive I, a comprehensive beginner-friendly workshop that teaches you how to build dynamic, interactive web applications using the latest Angular standalone components architecture. This 5-hour intensive hands-on session is perfect for developers with basic HTML, CSS, and JavaScript knowledge who want to learn one of the most powerful front-end frameworks used by companies like Google, Microsoft, and Netflix. Through practical exercises and real-world examples, you’ll transform from someone curious about Angular into a confident developer capable of building single-page applications with professional-grade code structure and best practices.

This Angular workshop focuses on the modern standalone components approach, eliminating the complexity of NgModules and giving you a streamlined learning experience that matches current industry standards. You’ll master essential concepts including component creation, TypeScript fundamentals, data binding techniques, component communication patterns, and client-side routing to create multi-page application experiences. Each topic includes hands-on coding exercises where you’ll build functional Angular components, implement interactive features, and construct a complete working application that demonstrates your new skills. Our experienced instructors guide you through common pitfalls and share tips that accelerate your learning curve.

Whether you’re a backend developer expanding into front-end technologies, a designer learning to code your own designs, or a career changer entering the tech industry, Angular Intensive I provides the essential foundation for building modern web applications. By the end of this workshop, you’ll have a portfolio-ready project and the knowledge to continue building Angular applications independently. All participants receive complete source code, component templates, Angular CLI cheat sheets, and curated resources for continued learning and professional development.


Topic Areas

Topic 1: Angular Fundamentals & Standalone Components

Learn how to set up your Angular development environment using Angular CLI, understand the modern standalone component architecture, and create your first Angular application from scratch. You’ll explore TypeScript basics essential for Angular development, understand component structure including templates, styles, and logic, and learn how to use Angular’s powerful template syntax. This session covers creating standalone components without NgModules, using decorators and metadata, and leveraging Angular’s built-in directives like *ngIf and *ngFor to create dynamic, data-driven user interfaces.

Topic 2: Data Binding & Component Communication

Master Angular’s powerful data binding techniques including interpolation, property binding, event binding, and two-way binding with ngModel to create interactive user experiences. You’ll learn how to capture user input, respond to events like clicks and form submissions, and update the UI dynamically based on component state. This session also covers component communication patterns including @Input and @Output decorators for parent-child component interaction, and how to structure your application with reusable, composable components that share data effectively.

Topic 3: Routing & Building Your First Angular App

Discover how to create multi-page application experiences using Angular’s powerful routing system to navigate between different views without page refreshes. You’ll learn to configure routes using the standalone routing API, implement navigation with routerLink directives, pass parameters between routes, and protect routes with guards. By the end of this session, you’ll build a complete Angular application that combines everything you’ve learned—including multiple routed components, data binding, component communication, and user interaction—into a functional single-page application ready for deployment.