Angular 4 RxJs Reactive Programming & FREE Ebook
4.4 (256 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,750 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Angular 4 RxJs Reactive Programming & FREE Ebook to your Wishlist.

Add to Wishlist

Angular 4 RxJs Reactive Programming & FREE Ebook

Uses Angular 4 (formerly Angular 2) Learn RxJs, Observables + Build Angular Applications in Reactive Programming Style
4.4 (256 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,750 students enrolled
Last updated 8/2017
Current price: $10 Original price: $150 Discount: 93% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 7.5 hours on-demand video
  • 2 Articles
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Know the core principles of RxJs and the Observable pattern
  • Know how to build Applications in Angular in Reactive Style using RxJs and a Catalog of Reactive Patterns
View Curriculum
  • Angular (formerly known as Angular 2)
  • Typescript

The course covers How To Build Angular Applications in Reactive Style using RxJs and the Observable Pattern, and its divided into two sections: the first is a deep dive into the Observable pattern as a way of understanding RxJs, and the second is a catalog of Angular  Design Patterns that will allow us to build angular applications in Reactive Style.

This course uses the Typescript language, and includes an auxiliary Ebook - The Typescript Jumpstart Ebook 

Versions used: The code repository of this course uses the Angular 4 release, Typescript 2.2 and optionally the Yarn Package manager.

What is Your Biggest Difficulty While Learning Angular ?

RxJS and Reactive Programming can sometimes be seen as hard to get into. Although RxJs is optional in many parts of the Angular API and we can usually use Promises instead, one of the items of the Angular Project Roadmap is to allow to build reactive style applications, so clearly reactive programming is a topic that is close to the framework.

What is The Best Way To Learn RxJs ?

Why is RxJs and Reactive Programming sometimes seen as hard to get into ? The main reason for that could be that Observables and reactive programming are often presented as either a programming paradigm shift, an alternative to Promises or a generalization of functions, which are approaches that don't help as much as we could think in the learning process.

We are going to take an alternative way for learning these concepts: we are going to see that RxJs and Observables are actually a very practical and effective solution to a very common set of problems that we face all the time while building asynchronous programs like user interfaces.

We are going to see that everything around RxJs and Reactive Programming revolves around one fundamental notion: The Observable Pattern.

The Best Way To Learn RxJs

We are going to approach reactive programming as a set of application development patterns, that are an evolution of previously existing solutions. So in the first section of the course we will cover the Observable pattern as a design solution for building asynchronous applications that scale well in complexity.

We are going to cover the multiple other satellite concepts around the Observable pattern, namely the Observer and the Subject, and we are also going to learn the benefits of writing applications in Reactive style by implementing our own simplified version of an event bus.

We are then going to see why that does not scale well in complexity, after that we will refactor the application into using the Observable pattern and see how it elegantly solves many of the problems of the initial implementation.

We will also introduce the Store Pattern, see how it relates to the Observable Pattern. At the of this section we will then introduce the RxJs library, which at this point will make a lot more sense given the previous presentation of the design patterns that its based upon.

What Patterns will be covered in this course ?

With the Observable pattern and its related concepts in place and having introduced the RxJs Library, we are going to see how it can be used to build Angular Applications in Reactive Style.

We are going to cover a set of reactive patterns for both the View Layer and the Service layer, by using a set of small applications with a ready to use backend built in either Firebase or a local HTTP server. The patterns will be introduced as either implementations from scratch of a given functionality, or via step-by-step refactorings.

The pattern catalog of the second part of the course will include: Stateless Observable Services, Smart vs Presentational Components, Observable Data Services, Nested Subscribe Anti-Pattern, Data Table Pagination, Local Services, Master Detail With Cached Master Table, Error Handling Components and Services, Router Data Pre-Fetching (with Loading Indicator), Container Components, Reactive Forms Draft Pre-Save.

This section also includes a couple of related discussions concerning application design, like how to avoid Event Bubbling over the local presentational component tree, and how to use deeply nested smart components with OnPush change detection.

What Will You Be Able To Do After Taking This Course ?

After taking this course you will be comfortable with Reactive Programming, the Observable Pattern and the RxJs library.

You will be able to reason much more easily about RxJs because you now know the fundamental concepts that it bases itself upon, as well as the design intentions behind it. You will be able to find your way around the documentation and know several commonly used operators. Most of all you know how to build Angular applications in Reactive Style using the RxJs library.

Who is the target audience?
  • Web Developers that want to learn reactive programming from first principles
  • Web developers looking to learn RxJs and use it to build Angular Applications in reactive style
Students Who Viewed This Course Also Viewed
Curriculum For This Course
81 Lectures
Getting Started - Why a New Package Manager ?
8 Lectures 34:49

The Typescript Jumpstart Ebook

Testing Our Tools Installation - Installing The Course Code

The Yarn Package Manager - Why Should We Use It ?

Scaffolding an Application Using the Angular CLI

Setting Up A Small Application For Learning Reactive Patterns
Why Build Applications in Reactive Style ?
13 Lectures 01:29:18

What Reactive Properties do Browser Events Have ?

Browsers Events and Reactive Programming - Another Important Similarity

Custom Application Events, the Observer Pattern - How Are They Related ?

Building An Application Based on a Custom Event Bus

Implementing a Global Event Bus From Scratch

Finishing the Implementation of a Global Event Bus - Its That Simple

Using The Global Event Bus To Broadcast Application Data

Improve Global Event Bus - Add Support To Different Types of Application Events

An Application Implemented in Non Reactive Style - What Does It Look Like ?

Adding Features to An Event Bus Application - Complexity Breakpoint Reached ?

Application Starts Not To Scale In Complexity - Who Owns Which Data ?

Only One More Feature - Learn Why The Application is no Longer Maintainable
The Key Concept of Reactive Programming - The Observable Pattern
15 Lectures 01:15:52

Building Our Program Around Observable Data Streams

A First Benefit of Building Asynchronous Applications in Reactive Style

Starting To Tackle A Second Architectural Issue

Implementing Our First Observable - An Unexpected Issue Occurs

Fixing Our Observable Implementation, Introducing a New Pattern

Is The Centralized Store a Reactive Pattern ?

Implementing Add Lesson - How To Ensure Encapsulation of Store Data

Refactoring Toggle And Delete Lesson - Avoiding Data Mutation On The View Layer

Application Working - Review Of The Benefits of Using a Reactive Approach

The Store And The Observable Patterns - How Are They Related ?

Introducing The RxJs Library - A Simple Explanation

Refactoring Our Application To Use RxJs

Introducing BehaviorSubject - When To Use It ?

Observable Pattern Conclusion And Introduction To Reactive Patterns Section
Reactive Patterns Catalog - Stateless Observable Services
9 Lectures 56:59

See Firebase Hot Observables In Action - Review Of Router Configuration

An Application Written in Imperative Style - What Does It Look Like ?

Learn An RxJs Anti-Pattern While Reviewing the Imperative-Style Application

Introducing The Stateless Observable Service Pattern

Designing And implementing The API of a Stateless Observable Service

Separating The View and The Service Layer With An Observable-based API

Service Layer API Design - Short-Lived or Long-Lived Observables ?

Refactoring a Component From Imperative To Reactive Style
Smart vs Presentational Components Part I
2 Lectures 10:04

Smart vs Presentational Components - What Are the Different Responsibilities ?
Observable Data Services
7 Lectures 41:39

Learn What Use Cases And Problems We Will Be Covering In This Section

Writing Our First Observable Data Services - API Design

Implementing The Login Functionality Using The User Observable Data Service

Implementing The User Service - Notice The Similarities

Redefining The API Of The User Observable Data Service

Observable Data Services - Conclusion and What's Next ?
Deeply Nested Smart Components / Component Design and On Push
4 Lectures 23:12
Avoiding the RxJs Nested Subscribe Anti-Pattern

Identifying a Common Design Problem

Fixing the Event Bubbling Design Issue

Making Deeply Nested Smart Components Work With OnPush Change Detection
Implementing a Data Table Pagination Service
5 Lectures 32:29

Implementing the Lessons Pager Service - How to Design a Pagination Service

Implementing a Pager Service - Loading Data From The Backend

Finishing The Implementation Of The Data Pager Service - Whats Next ?

The Local Service Design Pattern - Leveraging the Angular DI System
The Master Detail Design Pattern With Cached Master Table
4 Lectures 19:07
Switching Branches - The Master Detail Design Pattern With Cached Master Table

Master Detail Implementation - Implementing The Master Part

The Master Detail Pattern - Implementing The Detail Part

Master Detail With Cached Master Table Conclusion & How To Avoid Memory Leaks
Error Handling In Reactive Applications
5 Lectures 25:56
Error Handling In Reactive Applications - Avoid This Pitfall While Using Subject

26 Implementing Error Handling While Using Observable Data Services

Implementing an Error Handling System - The Messages Service

Implementing an Error Handling System - The Messages Component

Local Services And Error Handling - What's Next ?
3 More Sections
About the Instructor
Angular University
4.4 Average rating
1,643 Reviews
13,996 Students
7 Courses
Learn and Keep Up with The Angular Ecosystem

About the Angular University:

The Angular University aims to be the one place that you  go in order to learn and keep up with the Angular ecosystem. We provide premium quality video tutorials, screencast style.

About the course instructor:

Hello, my name is Vasco  and I'm a Software Developer with 17 years of experience, very seasoned building user interfaces with Angular. I've worked as a Frontend Developer/Architect in a large variety of enterprise projects throughout the years.   

I worked on a ton of projects, everything from single page applications to help build the European Criminal Record Information Exchange System, to brand new e-banking portals, to corporate banking portals, and more. I've been a key part of internal framework teams that built frameworks for in-house departments of tens of developers. And that's just a few of them, please check my Linkedin for extensive recommendations.

I also love to teach, write and talk about technology.  I am looking forward to be your Angular  instructor,

Kind Regards,