[Udemy] Angular 2 и NodeJs - Практическое руководство по MEAN2.0 (eng)

[Udemy] Angular 2 и NodeJs - Практическое руководство по MEAN2.0 (eng)

Научитесь как подключить фронтенд, написанный на Angular 2, к бэкенду, написанному на NodeJS, и создать настроящее приложение

Спойлер: О курсе

Published 5/2016 English
Course Description
Updated per 19th October 2016: This Course has been fully updated to Angular 2.0 Final!

Create modern, scalable and high-speed Web Applications with Angular 2 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 2.

Benefit from the many improvements and advantages Angular 2 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 2 Basics!

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

In this course, Maximilian, experienced web developer as well as author of two 5-star rated Udemy courses and host of a Coding Channel on YouTube, will take you on a hands-on journey to get you to build your own Angular 2 + NodeJS Applications in no time.

This course follows a hands-on approach, which means that the whole course is structured around one big application and the different concepts will be explained detailedly as they are introduced in this application.

This concept allows you to not get stuck in the theory, but instantly see real implementation examples!

Hear what students of other courses as well as viewers of my YouTube channel have to say

Max has gone through great lengths to create great content and this course has been great. His teaching style covers everything from basic to advanced topics, and his explanations have been thorough on each topic

Max demonstrates very good knowledge of the subject matter and great enthusiasm in delivering the lectures.

Max does a wonderful job making the core concepts of Angular 2 approachable and accessible.

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 2 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 2 Application
• Use NodeJS and Express efficiently
• Build reusable Components in Angular 2 and create a reactive User Experience with the Tools provided by Angular 2
• Connect your NodeJS (or any other language!) backend with your Angular 2 App through Angular 2’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...!

Don’t stop at the basics!

Do you know those courses which show you a „Hello World“ example and then call it an end? That won’t happen to you in this course. While beginning with a very basic app and basic features, you will quickly be able to incorporate many different routes, subrouting, Observables, Events, Authentication and Authorization, Error Handling and much more into your applications.
The best thing is: You’ll learn all that by putting it into practice immediately! No wall of powerpoint slides, no unrealistic mini-examples – this is the real deal!

Who should take this course?

• Basic NodeJS/Express and Angular 2 Experience is required
• You should be familiar with HTML, CSS and JavaScript Basics, too
• MongoDB (+ Mongoose) knowledge is a Plus as MongoDB will be used in this course but won’t be subject of in-depth explanations

By the end of this course, you will be able to create your own, awesome NodeJS + Angular 2 Applications!

FAQ:
1) Are you writing Angular 2 code in JavaScript or TypeScript?
TypeScript is the language of choice, since it not only makes development quicker, less error-prone and more fun, but also has the most documentation and resources on the internet (for Angular 2)
2) How much NodeJS and Angular 2 experience should I have?
You don’t need to be an expert by any means! All important concepts will be refreshed in this course and I will go into detail about the design and coding choices taken in this course. But I won’t start at zero for both languages, neither will I go into detail – for example you won’t get a detailed explanation of NodeJS views and view engines in this course, because we don’t need them (as Angular 2 will the frontend)

What are the requirements?

• Concepts behind NodeJS, Express and MongoDB (with Mongoose) will be refreshed in this course but as this course is focused on the connection of these technologies with Angular 2, basic knowledge about them is required
• It is recommended to have beginner-level Angular 2 knowledge, though this course will provided a detailed refresher and will explain the core concepts used in detail
• HTML, CSS and basic JavaScript knowledge is assumed throughout this course

What am I going to get from this course?

• Build real Angular 2 + NodeJS applications
• Understand how Angular 2 works and how it interacts with Backends
• Connect any Angular 2 Frontend with a NodeJS Backend
• Use MongoDB with Mongoose to interact with Data on the Backend
• Use ExpressJS as a NodeJS Framework
• Provide a great user experience by using Optimistic Updating on the Frontend
• Improve any Angular 2 (+ NodeJS) application by adding Error Handling

What is the target audience?

• This course is for everyone interested in putting existing Angular 2 and NodeJS knowledge into action
• If you're familiar with the basics of Angular 2 and NodeJS, this course provides a detailed guide on how to connect both technologies
• Everyone interested in building a modern, full-stack application
• Students who want to exercise with their NodeJS and Angular 2 skills will find a great opportunity to do so

Спойлер: Содержание

Section 1: Getting Started
Занятие 1 : Introduction -- [02:02]
Занятие 2 : What is NodeJS? -- [01:54]
Занятие 3 : What is Angular 2? -- [01:45]
Занятие 4 : How Angular 2 and NodeJS Work Together -- [03:58]
Занятие 5 : About the Course Structure -- [02:56]
Занятие 6 : Setting up the Course Project -- [04:26]
Занятие 7 : Understanding the Project Structure -- [06:27]

Section 2: NodeJS Basics
Занятие 8 : Introduction -- [00:56]
Занятие 9 : Understanding the Flow of a Request -- [09:37]
Занятие 10 : Working with Requests and Responses -- [03:55]
Занятие 11 : Creating Routes and Passing Data -- [05:25]
Занятие 12 : Knowledge Injection: Http Methods -- [01:51]
Занятие 13 : Knowledge Injection: Data Formats -- [02:56]
Занятие 14 : More on NodeJS -- [Article]

Section 3: MongoDB Basics
Занятие 15 : Introduction -- [01:52]
Занятие 16 : Setting up MongoDB -- [02:33]
Занятие 17 : Starting a MongoDB Server -- [01:28]
Занятие 18 : Using the MongoDB Shell Client -- [02:09]
Занятие 19 : Using Mongoose to work with Data and Models -- [01:21]
Занятие 20 : Using Mongoose in NodeJS -- [02:28]
Занятие 21 : Creating the Project Models with Mongoose -- [10:44]
Занятие 22 : Storing Data in the Database -- [06:12]
Занятие 23 : Fetching Data from the Database -- [04:04]
Занятие 24 : Wrap Up -- [00:35]
Занятие 25 : More on MongoDB -- [Article]

Section 4: Creating the Frontend with Angular 2
Занятие 26 : Introduction -- [01:18]
Занятие 27 : Rendering an Angular 2 App with NodeJS / Express -- [03:13]
Занятие 28 : Knowledge Injection - Components -- [01:51]
Занятие 29 : Starting an Angular 2 App -- [06:51]
Занятие 30 : Understanding Decorators -- [00:58]
Занятие 31 : Outputting Data with String Interpolation -- [02:29]
Занятие 32 : Working with Templates and Styles -- [04:53]
Занятие 33 : Two-Way-Binding -- [03:48]
Занятие 34 : Adding Custom Models -- [07:57]
Занятие 35 : Improving the Folder Structure -- [01:29]
Занятие 36 : Multiple Components -- [06:32]
Занятие 37 : Knowledge Injection - Property and Event Binding -- [04:10]
Занятие 38 : Using Property Binding -- [04:02]
Занятие 39 : Using Event Binding -- [06:16]
Занятие 40 : Knowledge Injection - Directives -- [02:39]
Занятие 41 : Understanding Attribute Directives -- [03:17]
Занятие 42 : Using NgFor to Output a List -- [03:56]
Занятие 43 : Adding Input and List Components -- [08:05]
Занятие 44 : Knowledge Injection - Services & Dependency Injection -- [02:10]
Занятие 45 : Creating a Service -- [02:54]
Занятие 46 : Adding Messages with a Service -- [04:43]
Занятие 47 : Getting Messages via a Service -- [04:25]
Занятие 48 : One Instance to Rule them All -- [02:54]
Занятие 49 : Adding Messages with a Template-Driven Form -- [11:04]
Занятие 50 : Creating a Header & Re-Structuring the Project -- [05:32]
Занятие 51 : Setting Up Routing -- [05:58]
Занятие 52 : Routing & Navigation -- [03:21]
Занятие 53 : Routing and the Server -- [02:04]
Занятие 54 : Creating User-related Components -- [04:03]
Занятие 55 : Adding Child Routes -- [07:44]
Занятие 56 : User Signup with Reactive (Data-Driven) Forms -- [12:52]
Занятие 57 : Finishing the Frontend -- [03:31]

Section 5: Connecting the Angular 2 Frontend with the NodeJS Backend
Занятие 58 : Introduction -- [02:38]
Занятие 59 : Backend - Saving Messages -- [09:08]
Занятие 60 : Knowledge Injection - Angular 2 & Http -- [02:50]
Занятие 61 : Saving Messages - Wiring Up Frontend and Backend -- [17:23]
Занятие 62 : Backend - Getting Messages -- [03:45]
Занятие 63 : Getting Messages - Wiring Up Frontend and Backend -- [07:21]
Занятие 64 : Editing Messages - Preparing the Frontend -- [12:57]
Занятие 65 : Backend - Updating Messages -- [04:28]
Занятие 66 : Editing Messages - Wiring Up Frontend and Backend -- [05:48]
Занятие 67 : Deleting Messages -- [04:48]

Section 6: Users and Authentication
Занятие 68 : Introduction -- [01:16]
Занятие 69 : How Authentication works in a MEAN Application -- [02:49]
Занятие 70 : Backend - Signing Up -- [07:02]
Занятие 71 : Signing Up Users - Wiring Up Frontend and Backend -- [10:53]
Занятие 72 : Backend - Sign In -- [12:16]
Занятие 73 : More Information on JWT -- [Article]
Занятие 74 : User Sign In - Wiring Up Frontend and Backend -- [06:49]
Занятие 75 : Logging Users Out -- [02:45]
Занятие 76 : Checking the Login State -- [03:19]
Занятие 77 : Backend Route Protection with JWT -- [06:11]
Занятие 78 : Connecting Users with Messages -- [08:41]
Занятие 79 : Sending Requests with a Token -- [05:23]
Занятие 80 : Handle User Authorization -- [03:21]
Занятие 81 : Passing the User Object with Messages -- [02:36]
Занятие 82 : Frontend Authorization Check -- [06:10]
Занятие 83 : Wrap Up -- [01:44]

Section 7: Error Handling
Занятие 84 : Introduction -- [00:53]
Занятие 85 : Setup -- [02:34]
Занятие 86 : The Error Component -- [07:51]
Занятие 87 : The Error Service -- [02:37]
Занятие 88 : Using an Error Service & Passing Data -- [06:00]

Section 8: App Optimizations and Deployment
Занятие 89 : Introduction -- [01:02]
Занятие 90 : Creating a Message Module -- [04:32]
Занятие 91 : Using an Auth Module and Lazy Loading -- [07:12]
Занятие 92 : Compiling the Compilation Ahead of Time (AoT) -- [02:21]
Занятие 93 : More on Angular 2 Modules -- [Article]
Занятие 94 : Deployment Preparations -- [01:18]
Занятие 95 : Deployment Disclaimer -- [Article]
Занятие 96 : Setting up MongoLab to Host the MongoDB -- [03:53]
Занятие 97 : Deploying to Heroku -- [08:08]
Занятие 98 : Deploying to AWS Elastic Beanstalk (AWS EC2 + AWS S3) -- [09:18]

Section 9: Creating a Custom Seed Project
Занятие 99 : Introduction -- [00:28]
Занятие 100 : Setting up NodeJS & Express -- [01:57]
Занятие 101 : Preparing the Backend -- [05:03]
Занятие 102 : Installing Production Dependencies and Types -- [02:55]
Занятие 103 : Installing Development Dependencies and Setting up a Common Webpack Config -- [08:30]
Занятие 104 : Setting up a Development Workflow with Webpack -- [02:39]
Занятие 105 : Creating the Angular 2 Frontend -- [06:16]
Занятие 106 : Adding a Development Workflow Script -- [02:46]
Занятие 107 : Setting up the Production Workflow (using AoT Compilation) -- [13:34]

Section 10: Updating Angular 2
Занятие 108 : Angular 2 Update from Beta to RC Version -- [08:41]
Занятие 109 : Updating from Release Candidate to Final Release -- [Article]

Section 11: OUTDATED: Getting Started
Занятие 110 : About OUTDATED Modules -- [Article]
Занятие 111 : Refresher: What is NodeJS? -- [02:04]
Занятие 112 : Refresher: What is Angular 2? -- [01:14]
Занятие 113 : How do NodeJS and Angular 2 work together? -- [03:27]
Занятие 114 : Update to Angular 2 Release Candidate -- [02:40]

Section 12: OUTDATED: Backend and Project Setup & NodeJS Refresher
Занятие 115 : NodeJS Installation & Seed Project Setup -- [04:20]
Занятие 116 : First NodeJS App -- [01:33]
Занятие 117 : Change your NodeJS App -- [02:13]
Занятие 118 : Explanation of Project Folder Structure -- [04:45]
Занятие 119 : NodeJS Request Flow -- [10:51]
Занятие 120 : Handling Requests -- [02:53]
Занятие 121 : Knowledge Injection: Http Methods -- [03:29]
Занятие 122 : Knowledge Injection: Data and Data Formats -- [06:19]
Занятие 123 : NodeJS Views -- [02:23]
Занятие 124 : Passing Data in NodeJS -- [04:59]

Section 13: OUTDATED: Data Storage with MongoDB (NoSQL Database)
Занятие 125 : Installing MongoDB and Running a MongoDB Server -- [07:53]
Занятие 126 : Data Access with Mongoose -- [03:39]
Занятие 127 : Setting up Mongoose in NodeJS -- [01:45]
Занятие 128 : Mongoose Schemas & Models -- [10:26]
Занятие 129 : Example: Inserting Data -- [03:44]
Занятие 130 : Example: Getting Data -- [05:17]
Занятие 131 : Wrap up -- [00:43]
Занятие 132 : More MongoDB and Mongoose Resources -- [Article]

Section 14: OUTDATED: Creating the Frontend with Angular 2 (includes Angular 2 Refreshers)
Занятие 133 : Intro -- [01:06]
Занятие 134 : Rendering a Single-Page-Application (using Angular 2) with NodeJS -- [05:37]
Занятие 135 : Import/ Structure Changes with Release Candidate -- [05:06]
Занятие 136 : Starting an Angular 2 App -- [05:20]
Занятие 137 : Using external Templates or Style Files -- [Article]
Занятие 138 : Knowledge Injection: Angular 2 Components -- [02:04]
Занятие 139 : Outputting Data with String Interpolation -- [06:10]
Занятие 140 : Styling the Frontend -- [01:40]
Занятие 141 : Refresher: Two-Way Databinding -- [04:21]
Занятие 142 : Custom Classes & Types: Creating the User and Message Classes -- [08:30]
Занятие 143 : Structuring the Angular 2 Frontend -- [01:16]
Занятие 144 : Splitting a Project into Components -- [06:41]
Занятие 145 : Knowledge Injection: Property Binding and Event Binding -- [06:52]
Занятие 146 : Using Property Binding -- [02:26]
Занятие 147 : Using Event Binding -- [04:53]
Занятие 148 : Knowledge Injection: Directives -- [04:26]
Занятие 149 : Example: Attribute Directives -- [03:04]
Занятие 150 : Example: Structural Directives -- [02:36]
Занятие 151 : Using ngFor to loop through multiple Messages -- [04:01]
Занятие 152 : ngFor Changes with Angular 2 Release Candidate -- [00:31]
Занятие 153 : Enhancing the Project: Implement new Components (MessageList and MessageInput) -- [07:07]
Занятие 154 : Knowledge Injection: Dependency Injection in Angular 2 -- [03:56]
Занятие 155 : Creating and Using a Message Service (1/3) -- [05:59]
Занятие 156 : Creating and Using a Message Service (2/3) -- [05:33]
Занятие 157 : Creating and Using a Message Service (3/3) -- [03:34]
Занятие 158 : Creating new Messages with a Template-Driven Form -- [05:53]
Занятие 159 : Routing Changes with Angular 2 Release Candidate -- [02:50]
Занятие 160 : Frontend Routing -- [11:48]
Занятие 161 : Knowledge Injection: Client-Side vs Server-Side Routing -- [05:36]
Занятие 162 : LocationStrategy Changes with Angular 2 Release Candidate -- [00:21]
Занятие 163 : User Components: Logout -- [02:46]
Занятие 164 : User Components: Signup with a Data-Driven Form -- [15:05]
Занятие 165 : Angular 2 Form Validation and Custom Validators -- [05:59]
Занятие 166 : User Components: Signin & Subrouting in Angular 2 -- [08:21]
Занятие 167 : Subrouting Changes with Angular 2 Release Candidate -- [01:56]
Занятие 168 : Wrap up -- [00:35]

Section 15: OUTDATED: Connecting the Angular 2 Frontend with the NodeJS Backend
Занятие 169 : Intro -- [01:26]
Занятие 170 : Backend - Saving Messages -- [10:11]
Занятие 171 : Knowledge Injection: Angular 2 Http -- [03:03]
Занятие 172 : Wiring Frontend and Backend up - Saving Messages (POST Http Request) -- [11:20]
Занятие 173 : Backend - Getting Messages -- [03:22]
Занятие 174 : Wiring Frontend and Backend up - Getting Messages (GET Http Request) -- [10:36]
Занятие 175 : Frontend - Editing Messages - Using EventEmitters (1/2) -- [09:04]
Занятие 176 : Frontend - Editing Messages - Using EventEmitters (2/2) -- [04:14]
Занятие 177 : Backend - Editing Messages -- [04:31]
Занятие 178 : Wiring Frontend and Backend up - Updating Messages (PATCH Http Request) -- [06:08]
Занятие 179 : Required Fix: Use [ngModel] instead of [value] -- [Article]
Занятие 180 : Frontend + Backend - Deleting Messages (DELETE Http Request) -- [03:24]

Section 16: OUTDATED: Users and Authentication
Занятие 181 : Knowledge Injection: Authentication and possible Problems -- [03:30]
Занятие 182 : Backend - User Signup -- [05:44]
Занятие 183 : Wiring Frontend and Backend up - User Signup -- [07:14]
Занятие 184 : Backend - User Signin and how to implement JSON Web Tokens -- [07:38]
Занятие 185 : Wiring Frontend and Backend up - User Signin and Storing the JWT -- [06:43]
Занятие 186 : Logging Users Out -- [01:59]
Занятие 187 : Checking the Login Status of a User -- [02:30]
Занятие 188 : Backend - Route Protection -- [04:57]
Занятие 189 : Matching Messages and Users -- [05:05]
Занятие 190 : Authenticating with a JWT -- [02:40]
Занятие 191 : Backend - Further Route Protection -- [02:26]
Занятие 192 : User-Message Relation - Using Mongoose Middleware -- [02:52]
Занятие 193 : Fetching more than One Model - Populating Data with Mongoose -- [06:28]
Занятие 194 : Edit & Delete Route Authorization -- [02:26]
Занятие 195 : Frontend Authorization Check -- [01:18]
Занятие 196 : Wrap up -- [00:49]

Section 17: OUTDATED: Error Handling
Занятие 197 : Intro -- [01:49]
Занятие 198 : Error Service -- [02:19]
Занятие 199 : Error Component -- [05:46]
Занятие 200 : Handling Errors & Wrap Up -- [05:10]

Section 18: OUTDATED: Creating your own Workspace / Seed Project
Занятие 201 : Introduction & NodeJS Express Generator -- [03:13]
Занятие 202 : Finishing the Backend -- [06:31]
Занятие 203 : Angular 2 Dependencies -- [06:07]
Занятие 204 : External Files & Typings -- [14:50]
Занятие 205 : Updates -- [Article]
Занятие 206 : TypeScript Compilation Configuration (tsconfig.json) -- [06:29]
Занятие 207 : Gulp -- [11:16]
Занятие 208 : Setting up the Index File (e.g. index.hbs) -- [05:11]
Занятие 209 : Fixing some Errors -- [00:23]
Занятие 210 : SystemJS Config -- [12:19]
Занятие 211 : Adding Third Party Packages -- [08:54]
Занятие 212 : Adding Production Workflows -- [15:41]
Занятие 213 Finished Project (Example) Article