by Maximilian Schwarzmüller | Publisher: Packt Publishing | Release Date: October 2018 | ISBN: 9781789959741

Learn how to connect your Angular frontend to a Node.js, Express, and MongoDB backend by building a real applicationAbout This VideoLearn to connect your Angular frontend to a Node.jsUnderstand how Angular works and how it interacts with backendsIn DetailThis course will take you on a journey where you'll you will learn to create modern, scalable, and high-speed web applications with Angular (formerly Angular 2, now just Angular) and Node.js, Express, and MongoDB. Angular 1 and Node.js—together with Express.js (a Node.js 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+. This course is no Angular course , but it includes detailed explanations of the core concepts used as well as about Angular in general.The code bundle for this video course is available at https://github.com/PacktPublishing/Angular-and-Node.js---The-MEAN-Stack-Guide

1. Chapter 1 : Getting Started
   • Introduction 00:01:29
   • What is MEAN? 00:10:36
   • What is a Single Page Application (SPA)? 00:02:09
   • How Does the MEAN Stack Work? 00:02:59
   • Installing Node & the Angular CLI 00:07:50
   • Installing our IDE 00:03:13
   • Exploring the Project Structure 00:04:03
   • Course Outline 00:03:28
   • How To Get The Most Out Of This Course 00:01:42
2. Chapter 2 : The Angular Frontend - Understanding the Basics
   • Module Introduction 00:01:41
   • Understanding the Folder Structure 00:06:40
   • Understanding Angular Components 00:02:39
   • Adding our First Component 00:08:01
   • Listening to Events 00:03:43
   • Outputting Content 00:05:34
   • Getting User Input 00:06:04
   • Installing Angular Material 00:12:16
   • Adding a Toolbar 00:03:57
   • Outputting Posts 00:06:38
   • Diving Into Structural Directives 00:05:41
   • Creating Posts with Property & Event Binding 00:07:38
   • Creating a Post Model 00:04:36
   • Adding Forms 00:08:19
   • Getting Posts from Post-Create to Post-List 00:09:26
   • Calling GET Post 00:11:17
   • More About Observables 00:05:51
   • Working on our Form 00:03:51
3. Chapter 3 : Adding NodeJS to our Project
   • Module Introduction 00:02:03
   • Connecting Node & Angular – Theory 00:04:38
   • What is a RESTful API? 00:04:46
   • Adding the Node Backend 00:08:21
   • Adding the Express Framework 00:07:38
   • Improving the server.js Code 00:04:40
   • Fetching Initial Posts 00:05:58
   • Using the Angular HTTP Client 00:09:21
   • Understanding CORS 00:05:32
   • Adding the POST Backend Point 00:05:28
   • Adding Angular 00:05:08
4. Chapter 4 : Working with MongoDB
   • Module Introduction 00:01:04
   • What is MongoDB? 00:01:49
   • Comparing SQL & NoSQL 00:04:26
   • Connecting Angular to a Database 00:02:07
   • Setting Up MongoDB 00:05:14
   • Adding Mongoose 00:03:02
   • Understanding Mongoose Schemas & Models 00:05:45
   • Creating a POST Instance 00:04:08
   • Connecting our Node Express App to MongoDB 00:03:10
   • Storing Data in a Database 00:05:52
   • Fetching Data From a Database 00:05:35
   • Transforming Response Data 00:05:08
   • Deleting Documents 00:07:37
   • Updating the Frontend after Deleting Posts 00:03:03
   • Adding Posts with an ID 00:07:08
5. Chapter 5 : Enhancing the App
   • Module Introduction 00:01:11
   • Adding Routing 00:10:12
   • Styling Links 00:04:00
   • Client Side vs Server Side Routing 00:02:44
   • Creating the "edit" Form 00:10:39
   • Finishing the Edit Feature 00:11:09
   • Updating Posts on the Server 00:09:21
   • Re-Organizing Backend Routes 00:05:54
   • Adding Loading Spinners 00:09:05
6. Chapter 6 : Adding Image Uploads to our App
   • Module Introduction 00:00:44
   • Adding the File Input Button 00:04:52
   • Converting the Form from a Template Driven to a Reactive Approach 00:13:42
   • Adding Image Controls to Store the Image 00:06:59
   • Adding an Image Preview 00:04:58
   • Starting with the Mime-Type Validator 00:08:20
   • Finishing the Image Validator 00:07:17
   • Adding Server Side Upload 00:08:23
   • Uploading Files 00:06:06
   • Working with the File URL 00:06:18
   • Fetching Images on the Frontend 00:06:37
   • Updating Posts with Images 00:13:21
   • Wrap Up 00:00:54
7. Chapter 7 : Adding Pagination
   • Module Introduction 00:01:04
   • Adding the Pagination Component 00:07:19
   • Working on the Pagination Backend 00:08:09
   • Connecting the Angular Paginator to the Backend 00:05:24
   • Fetching Posts Correctly 00:06:10
   • Finishing Touches 00:04:48
8. Chapter 8 : Adding User Authentication
   • Module Introduction 00:00:59
   • Adding the Login Input Fields 00:08:16
   • Handling User Input 00:03:42
   • Adding the Signup Screen 00:03:33
   • Creating the User Model 00:06:23
   • Creating a New User Upon Request 00:05:30
   • Connecting Angular to the Backend 00:06:39
   • Understanding SPA Authentication 00:03:40
   • Implementing SPA Authentication 00:09:33
   • Sending the Token to the Frontend 00:05:44
   • Adding Middleware to Protect Routes 00:11:48
   • Adding the Token to Authenticate Requests 00:13:45
   • Improving the UI Header to Reflect the Authentication Status 00:07:24
   • Improving the UI Messages to Reflect the Authentication Status 00:06:20
   • Connecting the Logout Button to the Authentication Status 00:02:33
   • Redirecting Users 00:04:26
   • Adding Route Guards 00:06:49
   • Reflecting the Token Expiration in the UI 00:06:12
   • Saving the Token in the Local Storage 00:15:54
9. Chapter 9 : Authorization
   • Module Introduction 00:01:10
   • Adding a Reference to the Model 00:03:29
   • Adding the User ID to Posts 00:07:03
   • Protecting Resources with Authorization 00:08:19
   • Passing the User ID to the Frontend 00:07:24
   • Using the User ID on the Frontend 00:05:12
10. Chapter 10 : Handling Errors
    • Module Introduction 00:01:14
    • Testing Different Places to Handle Errors 00:09:50
    • The Error Interceptor 00:08:01
    • Displaying the Basic Error Dialog 00:05:13
    • Adding an Error Dialog 00:05:26
    • Returning Error Messages on the Server 00:07:10
    • Finishing Touches 00:03:03
11. Chapter 11 : Optimizations
    • Module Introduction 00:00:34
    • Using Controllers 00:08:16
    • Separating the Middleware 00:03:30
    • Creating an Angular Material Module 00:04:21
    • Splitting the App Into Feature Modules 00:05:14
    • Fixing an Update Bug 00:02:32
    • Creating the Auth Module 00:04:09
    • Adding Lazy Loading 00:07:59
    • Using a Global Angular Config 00:06:18
    • Using Node Environment Variables 00:05:26
12. Chapter 12 : Deploying our App
    • Module Introduction 00:00:41
    • Deployment Options 00:04:00
    • Deploying the REST Api 00:13:35
    • Angular Deployment - Finishing the Two App Setup 00:09:51
    • Using the Integrated Approach 00:09:37
13. Chapter 13 : Course Roundup
    • Course Roundup 00:01:37