Angular 2 RxJs Jumpstart - HTTP and Services Made Simple

Vasco Ferreira, Web Development Online Instructor

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
15 Videos (1h 6m)
    • What is an Observable Introduction to Streams and RxJs Observables

      5:32
    • Observables Error Handling and Completion How do Observables handle Errors

      5:28
    • The RxJs Map Operator How to create an Observable from another Observable

      3:04
    • Observable Composition combine multiple Observables Using combineLatest

      5:58
    • How does Angular 2 HTTP use Observables The HTTP Response object

      3:51
    • How to use Observables and HTTP to build a Service Layer

      4:31
    • Introduction to Functional Reactive Programming Using the Async Pipe

      4:36
    • Avoid the Biggest Pitfall of Angular 2 HTTP Learn the RxJs Cache Operator

      5:09
    • How to do multiple HTTP requests using the RxJs Concat Operator

      4:18
    • How to do two HTTP Requests in Parallel using the RxJs combineLatest Operator

      3:58
    • How to setup an HTTP request sequence using the RxJs switchMap Operator

      4:32
    • Retry HTTP requests in Error using the retry and retryWhen RxJs Operators

      3:41
    • How to Cancel an HTTP Request using an RxJs Subscription

      2:56
    • Exercise Improve a Search Service and Build a Typeahead

      3:15
    • 15 Exercise Solution Learn How to build a Typeahead

      5:06

About This Class

Note: the videos in this course cover Angular 2 Final, and the lessons code is updated to Final

For building the service layer in Angular 2 we have many options available. Should we build a service layer in a similar way to Angular 1, or are there better ways ? How do we use the new HTTP module ? Everything around this module revolves around the notion of Observable. What is an Observable?

The goal of this course is to answer these questions by introducing the fundamentals of RxJs and Functional Reactive Programming and see how these notions apply in practice to the Angular 2 HTTP module. We will learn how to use the HTTP module and Observables to build service layers in Angular 2.

Covering RxJs completely would be the subject or a very large course, but the good news is that if we we are planning to use RxJs mostly to do HTTP calls, then we can focus on only a small subset of operators.

The course structure is simple: we will introduce RxJs and Observables and give a couple of simple examples, and aply it directly by using it to build the service layer of an Angular 2 Application. We will then see how to do the most common HTTP operations that you will do the most often in practice. RxJs does not have to be hard, we can approach it gradually and a great way to jumpstart our understanding of it is to use it in a very concrete case: in the case of this course we will focus on the Angular 2 HTTP Module.

dee89f37

We are going to introduce the notions of Stream and Observable, and explain how these two notions relate to the HTTP module. Then we are going to explain how Observables can be combined to create other Observables and how the HTTP module uses the notion of Observable to handle network calls.

We are going to see how to use the several RxJs operators to do common operations, such as for example: sending a request to the server that depends on a previous request, sending multiple requests in parallel, retrying a request or canceling a request.

Finally we are going to finish the course by using several of the presented RxJs operators to build a Typehead which cancels obsolete requests as the user types.

What you will Learn

After the completion of this course and the exercise you should feel comfortable with the notions of Stream, Observable and Functional Reactive Programming. You should be familiar with several frequently used RxJs operators and know how to use them to implement commonly needed use cases.

You will be comfortable building service layers in Angular 2 using Observables and the HTTP module in general, and will also have a good functional reactive programming foundation that will be helpful in other parts of Angular 2 that also use Observables: for example Forms or Routing.

12

Students

--

Projects

Vasco Ferreira

Web Development Online Instructor

About the Angular University:

The Angular University aims to be the only place that you need to go in order to learn and keep up with the Angular 2 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 2 instructor,

Kind Regards,

Vasco