Angular (Angular 2+) & NodeJS – The MEAN Stack Guide

Angular (Angular 2+) & NodeJS – The MEAN Stack Guide
Angular (Angular 2+) & NodeJS – The MEAN Stack Guide

English | MP4 | AVC 1280×720 | AAC 48KHz 2ch | 8 Hours | 1.46 GB
eLearning | Skill level: All Levels


Learn how to connect your Angular 2/ Angular 5 Frontend with a NodeJS Backend by building a real Application

This course is up-to-date to the latest version of Angular (formerly Angular 2): Angular 5.

Create modern, scalable and high-speed Web Applications with Angular 2/ Angular 5 (or just “Angular”) and NodeJS

Angular 1 and NodeJS, together with ExpressJS (NodeJS Framework) and MongoDB formed the very popular MEAN stack. Now is the time to dive into MEAN 2.0 and replace Angular 1 with Angular 4.

Benefit from the many improvements and advantages Angular offers you: Speed, ease of development, highly reactive, awesome support for asynchronous operations, great scalability and more!
And combine these advantages with the power of a NodeJS backend!

Learn or refresh the Angular Basics!

This course is no Angular course, but it includes detailed explanation of the core concepts used as well as about Angular in general. However, keep in mind that, as this course is no Angular course, having other resources at hand is recommended.

Hands-on: Build a real application throughout this course

I’m convinced that you learn the most while doing it! Therefore, in this course you will build a real application and whilst building it, you will learn, step by step, how to create an Angular frontend and hook it up to a secure and flexible NodeJS backend.
Starting off with a basic application, the course project will quickly incorporate user management, authentication, authorization, error handling, frontend and backend routing and much more!

Specifically, you will learn how to:

  • Set up a NodeJS + Express + MongoDB + Angular Application
  • Use NodeJS and Express efficiently
  • Build reusable Components in Angular and create a reactive User Experience with the Tools provided by Angular
  • Connect your NodeJS (or any other language!) backend with your Angular App through Angular’s Http Service
  • Provide appropriate endpoints on your Backend, for your Frontend to consume
  • Make your Application more secure by implementing Users and Authentication as well as Authorization
  • Handle Errors gracefully
  • And much more…!
+ Table of Contents

Getting Started
1 Introduction
2 What is NodeJS
3 What is Angular 2
4 How Angular 2 and NodeJS Work Together
5 About the Course Structure
6 Setting up the Course Project
7 Understanding the Project Structure

NodeJS Basics
8 Introduction
9 Understanding the Flow of a Request
10 Working with Requests and Responses
11 Creating Routes and Passing Data
12 Knowledge Injection Http Methods
13 Knowledge Injection Data Formats
14 More on NodeJS

MongoDB Basics
15 Introduction
16 Setting up MongoDB
17 Starting a MongoDB Server
18 Using the MongoDB Shell Client
19 Using Mongoose to work with Data and Models
20 MUST READ Mongoose Connection Changes
21 Using Mongoose in NodeJS
22 Creating the Project Models with Mongoose
23 Storing Data in the Database
24 Fetching Data from the Database
25 Wrap Up
26 More on MongoDB

Creating the Frontend with Angular 2
27 Introduction
28 Rendering an Angular 2 App with NodeJS Express
29 Knowledge Injection – Components
30 Starting an Angular 2 App
31 Understanding Decorators
32 Outputting Data with String Interpolation
33 Working with Templates and Styles
34 Two-Way-Binding
35 Adding Custom Models
36 Improving the Folder Structure
37 Multiple Components
38 Knowledge Injection – Property and Event Binding
39 Using Property Binding
40 Using Event Binding
41 Knowledge Injection – Directives
42 Understanding Attribute Directives
43 Using NgFor to Output a List
44 Adding Input and List Components
45 Knowledge Injection – Services Dependency Injection
46 Creating a Service
47 Adding Messages with a Service
48 Getting Messages via a Service
49 One Instance to Rule them All
50 Enabling Default HTML Validation in Angular 4
51 Adding Messages with a Template-Driven Form
52 Creating a Header Re-Structuring the Project
53 Setting Up Routing
54 Routing Navigation
55 Routing and the Server
56 Creating User-related Components
57 Adding Child Routes
58 User Signup with Reactive (Data-Driven) Forms
59 Finishing the Frontend

Connecting the Angular 2 Frontend with the NodeJS Backend
60 Introduction
61 Backend – Saving Messages
62 Knowledge Injection – Angular 2 Http
63 Saving Messages – Wiring Up Frontend and Backend
64 Backend – Getting Messages
65 Getting Messages – Wiring Up Frontend and Backend
66 Editing Messages – Preparing the Frontend
67 Backend – Updating Messages
68 Editing Messages – Wiring Up Frontend and Backend
69 Deleting Messages

Users and Authentication
70 Introduction
71 How Authentication works in a MEAN Application
72 Backend – Signing Up
73 Signing Up Users – Wiring Up Frontend and Backend
74 Backend – Sign In
75 More Information on JWT
76 User Sign In – Wiring Up Frontend and Backend
77 Logging Users Out
78 Checking the Login State
79 Backend Route Protection with JWT
80 Fixing a Mongoose Bug
81 Connecting Users with Messages
82 Sending Requests with a Token
83 Handle User Authorization
84 Passing the User Object with Messages
85 Frontend Authorization Check
86 Wrap Up

Error Handling
87 Introduction
88 Setup
89 The Error Component
90 The Error Service
91 Using an Error Service Passing Data

App Optimizations and Deployment
92 Introduction
93 Creating a Message Module
94 Using an Auth Module and Lazy Loading
95 Compiling the Compilation Ahead of Time (AoT)
96 More on Angular 2 Modules
97 Deployment Preparations
98 Deployment Disclaimer
99 Setting up MongoLab to Host the MongoDB
100 Deploying to Heroku
101 Deploying to AWS Elastic Beanstalk (AWS EC2 AWS S3)

Creating a Custom Seed Project
102 Introduction
103 Setting up NodeJS Express
104 Preparing the Backend
105 Installing Production Dependencies and Types
106 Installing Development Dependencies and Setting up a Common Webpack Config
107 Setting up a Development Workflow with Webpack
108 Creating the Angular 2 Frontend
109 Adding a Development Workflow Script
110 Setting up the Production Workflow (using AoT Compilation)
111 Updating the Custom Seed to Angular 5

Updating Angular 2
112 Angular 2 Update from Beta to RC Version
113 Updating from Release Candidate to Final Release

Download from DepFile

Download from Turbobit

Download from DepositFiles

Download from Rapidgator