Get all Angular courses today! x

Mastering MEAN.JS: Fullstack Ultimate Course

Build Angular e-Commerce online shopping application with PayPal gateway integration in MEAN stack. Deploy your app to cloud & connect with MongoDB. Source Code for the entire course is included in this course.

  • 4.9 Rating
  • (13 Reviews)
  • 24 User Enrolled
  • 320
  • 450
  • Course Includes
  • All HD Videos
  • Source code module by module
  • Slides for latest video
  • Subtitles for latest videos
  • Step by Step Guides
  • Course Completion Certificate
angular mongodb express node.js rxjs typescript

What you will learn

  • Angular in-depth from scratch
  • Node.js like pro programmers
  • Express
  • MongoDB
  • RxJS
  • Heroku
  • WebPack
  • Git Integration & Working Knowledge
  • Debugging
  • JWT
  • Programming
  • CI/CD
  • Web Programming
  • Angular Material
  • CSS
  • Build e-Commerce App from scratch

Course Content

25 sections • 85 lectures • 18h 30m total length
Creating eCommerce Online Shopping Application Guide Book

Complete guide book to create eCommerce Online Shopping Application using MEAN stack. This book has the source code and steps used in this entire course. 

Demo: Installing Node.JS on windows machine

In this video you will learn how to deploy and install node.js in your local machine. Download url for node.js https://nodejs.org/en/download/

Demo: Installing Git on windows machine

We will use git-hub as our source control. Therefore, I will install git in my machine. Git is very much popular. It is a good idea to know how to use git. Git download URL: https://git-scm.com/download/win

Demo: Installing VS Code on windows machine

In this course I will use visual studio code for coding. Therefore, let's install vs code from https://code.visualstudio.com/download url. If you already have vscode then you can skip this video.

Creating Angular App using Angular CLI

Angular team has an angular cli node package. Angular cli has some command line scripts to create angular application, angular component, service and module etc. I will demonstrate to you how to use angular cli to create angular apps.

Review Angular Project structure

Angular apps first created from angular cli could be overwhelming to see. Because you will notice lots of files created automatically. In this video I will walk you through all the files that angular cli has created and explain them to you.

Installing Angular Material Using Angular CLI

In order to style our component button, menu and layout etc. I will use Angular Material from google. Angular Material gives us ready made reactive components and now it is industry standard. I will demonstrate to you how to install angular material using angular cli.

Creating Angular Shared Material Module

Lets create a single module for angular material and put all the required material modules here.

Creating Products Module using Angular CLI


Let's create a product module as our first feature module. We will show the product list for our shopping application.I will use angular cli to create new module.

Lazy Loading Loading Products Module

Angular lazy loading enables us to improve the performance of our project. This is the best practice in angular application. Therefore, we will use a lazy loading feature. In the latest angular 10 you can use lambda expressions for module names.

Creating Product Angular Service

In Angular, we can put our business logic and shared logic inside a service class.

Service class can be injectable to any Angular component. This is called dependency Injection. In order to fetch products from the server and display them in our component. I will create product.service. Don't fetch products using httpclient from component because your component should not have business or infrastructure logic. Components should be very thin. It should only talk to business services like product service. 

Note: Get the product.json file attached in this chapter as learning material.


Note: In Angular 10 onwards you can not register service into the module. So Ignore the error that you are getting. Go ahead and register the service manually in the product module class.

Products Component using Angular Material Card Component

In order to make our design look great and responsive. I will use angular material. Card component is the best choice for our needs. Therefore, I will show how to use the card component.

Creating Toolbar Component using Angular Material Toolbar

Now in order to show the toolbar on the header, I will use an angular material toolbar. Watch this video to learn angular material toolbar integration.

Creating & Running Local Server using Express Node.js

In order to make our application fullstack. We need a server side. Server side programming can be done by Node.JS that we already have it installed. Now I will install express js and show you how we can use express.js to create a web server in our local machine. This webserver will serve all of our HTTP calls that we will make from an angular application. For example if we want to create a user then we will make an HTTP POST call to our web server to create one user in the server.


Creating Login Angular Component

In this video we will create a login component. Users will enter email and password to login to our site. You will learn angular two-way data binding in components. You will learn how to create angular service authentication service and create login and logout methods, use  authentication service in the login component. You will learn how to use ng models for 2-way data-binding. I will teach you bananas in the box pattern.

Creating Registration Angular Component

We will create a registration component, two-way data binding in the Registration component using Angular Reactive Form. Next I will show you how to use auth.service in register.component. In this component we will use Reactive Forms. You will learn why we need to use reactive form and how to create form groups in reactive forms. You will also learn how to do custom validation in reactive forms?

Logout after Registration & Login

In this video, we will work on registration and logout features. I will demonstrate custom reactive form validation to re-check user entered passwords. Watch this video to learn how we will create a logout method.

Creating Register Web API in Server

In this session we will create an authentication Web API in express. You will learn how to create express routes, controllers and middleware. I will demonstrate to you how to create a registered web api using REST architectural patterns.

Calling Register Web API from Register Component

Lets create an auth service that will connect with server restful api. You will learn how to use Angular HttpClient to make HTTP calls. I will also teach you how to set up a webpack proxy in angular.json file to call local server REST APIs to avoid CORS errors.

Creating Login Web Api in Server and Calling from Angular App

We will create a login web api. So that user can login. You will learn how we can create REST API login in express. I will teach you how we can do validation on the server to check if the user is valid. Next I will show you how to call this login web-api from an angular app and navigate the user to the home page after successful login.

MongoDB Installation Step by Step Guide Book
Installing And Configuring MongoDB & Integrating Mongoose to Express in Server

Installing And Configuring MongoDB & Integrating Mongoose to Express in Server. In MEAN Stack we use MongoDB as our database. In this video I will demonstrate the installation of mongodb on a Windows machine. Install MongoDB community server and MongoDB Compass User Interface. MongoDb Installation for windows msi to install in windows machine. Feel free to use Atlas for browsing mongoDB tables if you want to.

I will also teach you how to integrate mongoDb with express. We will use the Mongoose node package for our data models and for connecting to mongodb. 

Note: `useNewUrlParser: true,useUnifiedTopology: true` use this to initialize mongodb connection.

Save user in MongoDB during User Registration

I will teach you how you can create a User Model and save users into MongoDB. You will learn how to create a user controller in express to save user data. We will install & use bcrypt for encrypting user passwords.

Find User from MongoDb during User Login

I will demonstrate to you how we can use Mongoose in-built schema validation. So that whenever user information is incorrect from the client then the database will throw an exception and we will not allow the user to save invalid data. We will create a login web api. So that user can login. You will learn how we can create REST API login in express. I will teach you how we can do validation on the server to check if the user is valid. Next I will show you how to call this login web-api from an angular app and navigate the user to the home page after successful login.

Debugging Server Side in Visual Studio Code

Now I will demonstrate how you can debug server side code in vscode live. Watch this video. It will help you debug any node.js application that you will work eventually.

Debugging Angular App with Server in Visual Studio Code

In this video, I will teach you how you can add configuration on vs code such that you can debug angular applications. Also We create one more setting where you can debug both angular and node.js applications.

Creating An Express Middleware For JWT Authentication With B-Crypt Passport

We will guard our HTTP POST/GET REST APIs. Any http call that comes to the server must have an authentication token. I will teach you how express middleware will help us to achieve this feature. Very exciting and demanding module on express never misses this! I will demonstrate you by installing passport-jwt, passport-local, jsonwebtoken and bcrypt node packages. Next we will create middleware for passport local strategy. We will create a controller method to get users by id from MongoDB for validation.

Creating JWT with JSON Web Token And Integrating With Express

You will see how we can create a jwt token using the jsonwebtoken node package. I will show you how to integrate the express middleware function for authentication into express apps. Next enter the secret key into the .env file so that production/qa/uat servers can have different secret keys to encrypt our server side JWT token.

Creating Login Middleware and Returning JWT token into HTTP Response


You will learn how to return a JWT token into the HTTP response object for user register or login function from server. So that angular client application can send the same JWT token for any HTTP server call. I will show you how to use login as middleware in express.