angular-university/reactive-patterns-course

Contains the code for the RxJs & Reactive Patterns Angular Architecture Course

THIS COURSE IS ARCHIVED

This course has been archived and is now replaced by the Reactive Angular Course.

Repository Content

This repository contains of the Angular University RxJs and Reactive Patterns Angular Architecture Course.

This course repository is updated to Angular v7, there is a Yarn lock file available.

RxJs and Reactive Patterns Angular Architecture Course

Installation pre-requisites

This project has minimal dependencies, you only need node and npm installed on your machine. These are some tutorials to install node in different operating systems.

Make sure to install the latest version of Node

• Install Node and NPM on Windows
• Install Node and NPM on Linux
• Install Node and NPM on Mac

Installation Instructions

First clone or download as a Zip file using the green "Clone Or Download" button on the top right of the document.

Then change directory to the folder 01-getting-started-with-angular2, where you will find a small node project with a package.json.

On the command line run the following:

npm install

If you prefer the Yarn package manager, you can also run:

yarn

Although npm install would also work, its recommended to use Yarn to install the course dependencies. Yarn has the big advantage that if you use it you will be installing the exact same dependencies than I installed in my machine, so you wont run into issues caused by semantic versioning updates.

This should take a couple of minutes. If there are issues, please post the complete error message in the Questions section of the course.

Starting the development server

To start the server, run the following command:

npm start

If you now go to http://localhost:8080, there will be a running application at this url.

Making changes

If you edit a Typescript file and refresh the browser, the changes will be applied.

Firebase data for later in the course

In one of the sections of the course, we will be using a Firebase database. If you would like the data to create your own instance, you can find it here.

This is completely optional, as the course will use a connection to an existing Firebase database, and everything will work out of the box.

Which Course are You Looking For ?

If you are looking for the code of the following courses, see further the installation instructions on this page:

• Angular For Beginners
• Angular Services and HTTP
• Angular Router
• Angular Forms

Angular and Firebase - Build a Web Application Course

If you are looking for the Angular and Firebase - Build a Web Application Course code, the repo with the full code can be found here:

Angular and Firebase - Build a Web Application

Github Repo For this course

Complete Typescript 2 Course - Build A REST API

If you are looking for the Complete Typescript 2 Course - Build a REST API, the repo with the full code can be found here:

Complete Typescript 2 Course - Build A REST API

Github Repo for this course

Angular Ngrx Reactive Extensions Architecture Course

If you are looking for the Angular Ngrx Reactive Extensions Architecture Course code, the repo with the full code can be found here:

Angular Ngrx Reactive Extensions Architecture Course

Github repo for this course

Brought to you by the Angular University

Have a look at our course pipeline at angular-university.io.

reactive-patterns-course's Issues

Branch stateless-services has invalid imports for angularfire2 database module.

Branch stateless-services contains invalid imports of angularfire2 modules. Running npm start yields the following errors:

ERROR in src/app/course-detail/course-detail.component.ts(2,9): error TS2305:
Module '".../node_modules/angularfire2/index"' has no exported member 'AngularFireDatabase'.
src/app/home/home.component.ts(2,9): error TS2305:
Module '".../node_modules/angularfire2/index"' has no exported member 'AngularFireDatabase'.

Pull request #7 - fixes this

Wrong merge into introduce-rxjs branch

Hi looks like main.ts has been committed without resolving conflicts
https://github.com/angular-university/reactive-patterns-course/blob/introduce-rxjs/src/main.ts

Cannot read property 'apply' of undefined

while trying to run the application, i am getting an error Uncaught TypeError: Cannot read property 'apply' of undefined"Cannot read property 'apply' of undefined"
in vendor.bundle.js:35669
I installed the modules using YARN. How to get rid of this issue.

event-bus-experiments is broken

Lessons list and lessons counter does not update it's data on the screen though next() method receives an updated value.

demo app `npm start` fails

Hello,

I've downloaded the project, executed npm install and npm start, as stated in the docs and I get following error:

$ npm start

> [email protected] start C:\Users\Tomasz.Ducin\Development\learn\angular\reactive-patterns-course
> ng serve  --proxy-config proxy.conf.json

** NG Live Development Server is running on http://localhost:4200 **
Hash: ba6c3da912e2fa390e43
Time: 13387ms
chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 157 kB {4} [initial] [rendered]
chunk    {1} main.bundle.js, main.bundle.js.map (main) 72.3 kB {3} [initial] [rendered]
chunk    {2} styles.bundle.js, styles.bundle.js.map (styles) 9.78 kB {4} [initial] [rendered]
chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 4.13 MB [initial] [rendered]
chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]

ERROR in Error encountered resolving symbol values statically. Calling function 'OpaqueToken', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol FirebaseUserConfig in C:/Users/Tomasz.Ducin/Development/learn/angular/reactive-patterns-course/node_modules/angularfire2/tokens.d.ts, resolving symbol AngularFireModule.initializeApp in C:/Users/Tomasz.Ducin/Development/learn/angular/reactive-patterns-course/node_modules/angularfire2/angularfire2.d.ts, resolving symbol AppModule in C:/Users/Tomasz.Ducin/Development/learn/angular/reactive-patterns-course/src/app/app.module.ts, resolving symbol AppModule in C:/Users/Tomasz.Ducin/Development/learn/angular/reactive-patterns-course/src/app/app.module.ts
webpack: Failed to compile.

Are you gonna update the setup?

Lecture 34

I hit this error after this change:
public lessonsList$: Observable<Lesson[]> = this.lessonsListSubject.asObservable();

ERROR in src/app/event-bus-experiments/app-data.ts(11,5): error TS2322: Type 'Observable<{}>' is not assignable to type 'Observable<Lesson[]>'.
Type '{}' is not assignable to type 'Lesson[]'.
Property 'includes' is missing in type '{}'.

as best as I can tell I haven't missed anything but compilation is failing.