Angular Architecture and Best Practices

By Dan Wahlin
Learn how to build a solid Angular application architecture that is easy to refactor and maintain. Topics covered include code/component/module organization, component communication, RxJS, state management, best practices, and more.
Play course overview
Course info
Rating
(215)
Level
Intermediate
Updated
Jan 15, 2019
Duration
5h 21m
Table of contents
Course Overview
Course Overview 2m
Introduction
Course Overview 4m Introduction 2m Key Concepts and Learning Goals 6m Prerequisites to Maximize Learning 1m Sample Application and Software Requirements 2m
Planning the Application Architecture
Architecture Considerations 8m Architecture Planning Template 5m Architecture Planning Template Example - Part 1 7m Architecture Planning Template Example - Part 2 6m Introduction 2m Other Considerations 4m Summary 3m The Angular Style Guide 3m
Organizing Features and Modules
Consuming a Custom Library 5m Core and Shared Modules 4m Core and Shared in Action 9m Creating a Custom Library 6m Feature Modules 7m Introduction 2m Organizing Features 9m Putting All the Modules Together 5m Summary 3m
Structuring Components
Change Detection Strategies 7m Cloning Techniques 1m Cloning in Action 8m Cloning with Immutable.js 4m Component Inheritance 2m Component Inheritance in Action 5m Container and Presentation Components 8m Container and Presentation Components in Action 6m Input and Output Properties in Action 8m Introduction 2m Passing State with Input and Output Properties 4m Reference vs. Value Types 5m Summary 3m
Component Communication
Component Communication 5m Creating an Event Bus Service 7m Creating an Observable Service 5m Introduction 2m RxJS Subjects in Action - Part 1 3m RxJS Subjects in Action - Part 2 8m Summary 2m Understanding RxJS Subjects 8m Unsubscribing from Observables 4m Using an Event Bus Service 5m Using an Observable Service 3m
State Management
Angular Services 4m Introduction 2m NgRx 5m NgRx in Action 7m Observable Store 5m Observable Store in Action 5m State Management Options 3m State Management Review 6m Summary 2m The Need for State Management 4m ngrx-data 3m ngrx-data in Action 8m
Additional Considerations
Functions and Pipes in Action 6m Functions vs. Pipes 3m HTTP Interceptors 4m HttpClient and RxJS Operators 11m Introduction 3m Key Security Considerations 9m Summary 3m Using a Memo Decorator 6m
Course Summary
Course Summary 4m
Description
Course info
Rating
(215)
Level
Intermediate
Updated
Jan 15, 2019
Duration
5h 21m
Description

There's a lot of questions out there about the core concepts of Angular, including: are you following established best practices? How easy will it be to maintain and refactor the application in the future? If you're starting a new application from scratch, what application architecture should be used? In this course, Angular Architecture and Best Practices, you'll learn architectural concepts, best practices, and how to solve some of the more challenging tasks that come up. First, you'll discover component communication techniques. Next, you'll learn state management and code organization. Finally, you'll explore general best practices, performance considerations, and more. When you're finished with this course, you'll have the skills and knowledge of Angular application architecture needed to think through the process of building a solid application architecture that is easy to refactor and maintain.

About the author
Dan Wahlin
About the author

Dan Wahlin founded Wahlin Consulting, which provides consulting and training services on JavaScript, Angular, Node.js, C#, ASP.NET MVC, Web API, and Docker. He is a Google GDE, Microsoft MVP and Regional Director, and speaks at conferences and user groups around the world.

More from the author
Getting Started with Docker Containers
Beginner
1h 21m
Sep 3, 2020
Building and Running Custom ASP.NET Core Containers
Beginner
1h 20m
Sep 3, 2020
Docker for Web Developers
Beginner
5h 38m
Jun 30, 2020
More courses by Dan Wahlin
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
(Music) Welcome to the Angular Architecture and Best Practices course. My name's Dan Wahlin, and I'm a software developer, architect, and trainer specializing in web technologies. Over the years, I've had the opportunity to work with many companies around the world on front end and back-end architecture, and I'm really excited to share some of the information I've learned with you. Application architecture is a big topic, and one that can be very subjective, so the overall goal of this course is to provide you with solid, proven guides that can be used as you plan and build your applications. The course starts out by discussing key architecture considerations to take into account when doing initial planning of your application. Over the years, I've created a simple architecture planning template that I use with companies, and I'll show you how you can get started using it. From there, you'll learn how to structure features and modules in a self-contained manner that allows team members to develop and deploy features independently. Sharing functionality across an application or across multiple applications is also key as you plan any architecture, and you'll learn about the role that custom Angular libraries can play there. As the course progresses, you'll learn about the container presentation pattern and how it can be used to structure components, component communication techniques, and the importance of RxJS subjects, and learn about the need for state management and the different options that exist. Finally, additional considerations such as pipes versus functions and different RxJS operators that can be used with HTTP calls will also be covered. So, let's get started and jump right in.

You're the smartest person in the room

PROVE IT

Your team won't just close the skills gap

THEY'LL HURDLE IT