Building Angular and Node Apps with Authentication
3h 19mIntermediate2019-04-04
Authors
Alexander Zanfir
President of SocialPlay Inc.
Course details
Are you already familiar with Angular 2 and Node.js? If so, this course can help you leverage these two popular frameworks to build a full-stack web application—which you can later use as a template for your own web app. Join Alexander Zanfir as he shows how to create and configure an Angular 2 project, display data in Angular 2, get your data from Node.js, and save your data to Node.js. He also covers how to create a form in Angular, set up routes, validate with reactive forms, register users, and more.
Learning objectives
Setting up the infrastructure
Displaying data in Angular 2
Refining your layout with Angular Material
Getting your data from Node.js
Saving data to a list
Creating the component
Getting your input data
Creating reactive forms in Angular
Creating a security middleware
Learning objectives
Setting up the infrastructure
Displaying data in Angular 2
Refining your layout with Angular Material
Getting your data from Node.js
Saving data to a list
Creating the component
Getting your input data
Creating reactive forms in Angular
Creating a security middleware
Skills covered
AngularNode.jsIdentity and Access ManagementJavaScript FrameworksCybersecurityWeb DevelopmentOpen Source
Concepts
0. Introduction
- 01 - Welcome
- 02 - What you should know
- 03 - Using the exercise files
1. Setting Up the Infrastructure
- 04 - Demo application overview
- 05 - Architectural overview
- 06 - Download and install Node
- 07 - Creating and configuring the Angular 2 project
2. Displaying Data in Angular 2
- 08 - Creating the component
- 09 - Show our data
- 10 - Refining your layout with Angular Material
3. Getting Your Data from Node
- 11 - Set up express
- 12 - Create a service
- 13 - Updating Angular to get data from your service
4. Saving Your Data to Node
- 14 - Create a post service
- 15 - Save data to a list
- 16 - Creating an express router
5. Creating a Form in Angular
- 17 - Creating the component
- 18 - Get our input data
- 19 - Communicate between multiple components with Output and ViewChild
- 20 - Create a data store in our service
- 21 - Handle errors with try or catch
6. Navigating with Router
- 22 - Create a nav bar
- 23 - Set up routes
- 24 - Add a messages route
- 25 - Pass a route parameter
- 26 - Retrieve a route parameter
7. Reactive Programming
- 27 - HTTP get with Observable
- 28 - Broadcast an event with a subject
- 29 - Observables and the async pipe
8. Creating Reactive Forms in Angular
- 30 - Create a register layout
- 31 - Reactive forms with FormBuilder
- 32 - Validate with reactive forms
- 33 - Validate passwords with a custom validator
- 34 - Validate emails with a custom validator
9. Registering Users
- 35 - Create an Angular auth service
- 36 - Create a node register service
- 37 - Authenticate with JSON web tokens
- 38 - Store a token with Angular
- 39 - Implement an authentication check
- 40 - Log out
10. Logging In
- 41 - Create an Angular login component
- 42 - Create the login services
11. Authorizing Resources
- 43 - Send a token with Angular HTTP requests
- 44 - Create a security middleware
- 45 - Edit user Info
- 46 - Update message posting
Conclusion
- 47 - Next steps