Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Mastering MEAN.JS: Fullstack Ultimate Course

Name: Mastering MEAN.JS: Fullstack Ultimate Course
Rating: 4.4 (18 reviews)

Created byRupesh Tiwari

Last updated 10/2021

English

What you'll learn

Build e-commerce Angular + NodeJS application from scratch integrate Angular Material.
Use VS Code, Angular Material, Git. Learn debugging both server and client from vscode.
Learn Reactive Angular programming and learn organizing angular modules, folders and their dependencies.
Server side programming using nodeJS and express and debugging & Fixing Bugs. Demo on angular debugging, fixing bugs
Securing web APIs using JWT and implementing authentication and authorization.
Implementing Database Programming using MongoDB & Mongoose npm package.
Building & Deploying Angular App to cloud in Heroku.
Learning Tools & Software like: vs code, git, webpack, NodeJS, express, JWT, angular material.

Course content

26 sections • 86 lectures • 18h 53m total length

Introduction0:41
Kick off the master mean.js fullstack course with an introduction that outlines the course structure, learning objectives, and the core concepts of the mean stack.

Demo: Installing Node.JS on windows machine3:47
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 machine4:04
We will use git-hub as our source control. Therefore, I will install git on 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 machine2:29
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 Visual Studio Code then you can skip this video.

Creating Angular App using Angular CLI19:40
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 structure5:42
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 CLI12:32
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 Module11:27
Lets create a single module for angular material and put all the required material modules here.

Creating Products Module using Angular CLI30:48
Let's create a product module as our first feature module. We will show the product list for our shopping application.
Lazy Loading Loading Products Module2:15
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 Service14:26
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 HTTP client from the 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: 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 Component14:38
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 Toolbar20:16
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.js43:05
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 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 Component26:04
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 about bananas in the box pattern.
Creating Registration Angular Component18:50
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 & Login1:07:04
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 Server45:33
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 Component36:49
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.

Installing And Configuring MongoDB & Integrating Mongoose to Express in Server28:02
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 Registration21:07
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 Login18:04
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.

Requirements

Basic working knowledge on HTML, JS, CSS & RxJS

Description

Mastering MEAN.JS: The Ultimate Full Stack Course is the world class material to become a full stack MEAN developer. Learn how to build an e-commerce online shopping responsive web application from scratch using Angular 10+, Express & Mongo Db complete MEAN stack course. Learn how to integrate with PayPal gateway & finally learn how to deploy the app into the cloud using Heroku. This app is responsive such that it works on mobile, tablet and desktop.

What is MEAN.JS & MEAN Stack? ??‍?

MEAN.JS is a full-stack JavaScript solution that helps you build fast, robust, and maintainable production web applications using MongoDB, Express, Angular, and Node.js. The MEAN stack is a collection of four main software application components (MongoDB, Express, Angular, NodeJS) that are used together to form a complete web application platform.

Why should I learn MEAN stack? ??

In Asp .NET stack you need to learn:

C# for server side programming
JavaScript for client side programming
SQL for database

In LAMP ? (Linux, Apache, MySQL, and PHP.) stack you need to learn:

PHP for server side programming
JavaScript for client side programming
MYSQL for database

In MEAN (MongoDB, Express, Angular, and Node JS) or MERN (MongoDB, Express JS, React JS, and Node JS) stack

You only need to learn JAVASCRIPT for client, server and database programming?
Many big companies like Linked In, Twitter, Amazon, Google & Microsoft are using MERN and MEAN stack to build their applications. That is why I prefer MEAN or MERN stack.

Which Angular App I will build in this course?

After finishing this course you will build a production ready ecommerce online shopping angular application. Please visit this site to see what you will build ecommerce online shopping application. Feel free to register yourself and run all of the use cases that I have mentioned. You can play with this app on your mobile, tablet and desktop! Enjoy! This is the pro app that you will build right from the blank angular app till this level in Angular and node.js.

In this course we will start with a basic angular app. I will teach you how to use angular CLI to create angular new angular application, angular components, angular services, angular module & also to build and serve angular application. Then we will go deep on Angular by learning Angular interceptors, Services, Dependency Injections, Unit Testing, Higher Order Observables and much more.

So get ready and I am super excited to teach you in this course.

Why should I enroll in a Mastering MEAN.JS course?

Mastering MEAN.js is the premiere video course for building production, Fullstack applications with Reactive Angular, Node.js & Mongo-DB from scratch. Create a highly scalable eCommerce web app using MEAN stack. You will build responsive web applications that will work in mobile, tablet, iPad, desktop etc. Build user login & authentication. Gateway to PayPal for credit card payment process. Visit Live Demo eCommerce App here.

Nowadays JavaScript is used for blackened and front-end development. Facebook, Amazon, Google, Microsoft, LinkedIn, Netflix and many more big companies. Additionally many mid level companies are looking for JavaScript full-stack developers. Therefore, you should strive to get expertise on JavaScript and want to make your career in JavaScript. On the same note, making Full Stack applications using JavaScript was never possible without MEAN.js. Therefore, Companies all over the world are using MEAN.js to build high performance, highly scalable applications. This course will teach you the skills necessary to build the best-in-class Full Stack Angular application powered by Node.js in MEAN stack.

If you are already a developer then you should definitely enroll in this course in order to learn MEAN.JS and how to organize large angular projects. You will also learn how you can deploy your code to the cloud. These are top requirements that companies are looking for so it is a good idea to have these knowledge and skill sets. You will learn event driven architecture style which is vastly used in micro-services architecture and enterprise service bus kind of projects. So it is a great course for you to get yourself ready for your next ngrx, angular or any event driven architecture style projects.

If you are a student or person who wants to start a career in programming on Angular then also this course is helpful to you. So that you will get full hands on coding experience for writing Angular Node.js applications from scratch and deploy to the cloud. This will give you a great boost to your career.

Is this course for me? Well below are the viewers who can benefit from this course. This course is highly recommended for all software engineers who are in Angular technology or want to come on Angular related technology.

Who wants to learn Angular from basic to professional Angular programming level in the right way.
Who is preparing for interview in Angular & MEAN stack ( must purchase this course highly recommended for interview preparation )
Who wants to build full fledged production like an e-commerce app from scratch.
Who wants to become a Full Stack Software Engineer.
Who wants to become a LEAD Software Engineer in their current company.
Who wants to learn Angular, express & Mongo-DB in-depth.

What are the features I will build in Angular eCommerce Shopping App?

In Mastering MEAN.JS ultimate course you will build an e-commerce online shopping web application & you will work on below features:

Product mart app should show all of the products on the shopping page.
New users can register in our product mart.
Registered users can login / log out.
Once a user is logged-in, users can browse through the shopping page.
Users can add products to their cart.
Users should be able to update quantity, delete items on their cart page.
Users should be able to purchase cart items by checking out their cart.
Users should be able to pay their order by using their PayPal account.
System should handle payment successfully, cancel payment, and error situations while payment.
Once an order is placed & payment is successful, the user should receive a confirmation email.
Users should be able to view all of their orders so far placed.
Users should be able to view details of a selected order.
All of the API on the server side is secured and un-authorized users should not have access.

What should I know before I enroll in this course?

You need basic working knowledge on HTML, JS, CSS & RxJS.

You can start learning RxJS for free from Fullstack master school.

Learning RxJS is highly recommended before you start this course. Therefore please learn below RxJS courses in the given sequence.

RxJS Getting Started
RxJS Marble Diagrams Introduction
RxJS Subjects Getting Started
RxJS State Management Techniques

What will I Learn in the Mastering MEAN.js course?⛳

This course is full of theory and practical knowledge. I will give you lots of Interview questions for Angular & Node.js. You will learn Angular coding from beginning till the Angular PRO level coding. I will teach you debugging and fixing Angular & Node.JS. You will learn below skills and technology stacks. I will teach you both client side and server side technology. You will learn MEAN stack from scratch. I will go deep in Angular by teaching you Http Interceptors, Dynamic Dialog registrations, Reactive forms, custom validations, redux style selectors, push based architecture, local storage service and much more. On the server side I will teach you express middleware, JWT authentication.

Learning Angular Right way

Learn how to use Angular CLI to create components, App, Module, Service.
Learn Angular Dependency Injection from basic to pro level.
Learn how to create & use Angular Services.
Learn how to create & use Angular Components.
Learn how to communicate between child & parent angular components.
Learn how to communicate with a server using HTTP Client in Angular.
Learn how to use Angular Pipe & Filters.
Learn Angular & RxJS integrations.
You will learn how to write unit tests for Angular apps.
I will teach you how to use Angular Interceptors to modify Http Headers & add JWT token for each HTTP request to Server.
Use RxJS Behavior Subject to create Managed State Services in Angular.
Learn how to create RxJS higher order observables to solve complex subscriptions.
Write Angular lazy loaded modules for improving app performance.
Learn how to integrate and use Angular Material in the Mastering MEAN.js course.
You will learn how to use Angular Material Dialogs in Angular App.
I will teach you how to use Angular Material Tables, Paginations and sorting.
Learn Flex Layout & make mobile friendly web applications.
You will build responsive apps that will work on Mobile, Tablet, iPad & desktop.
Learn Why and how to use Reactive Forms in Angular app.
I will teach you how to write a Reactive Angular App.
You will learn how to debug angular code & server side code together.

Learning Angular Architecture

Distilling the problem domain to find the best solution.
Breaking big problems into small problems.
Learn how to organize your angular app.
Organizing large scale angular application folder structures.
Learn what is Feature, Core, Shared and Block modules.
Understanding the dependency graph of various modules like CORE, SHARED and Block Modules.
Industry standard best practices for large scale full stack applications.

Learning Reactive Angular Programming

Learn how to use Reactive Forms to write Reactive Angular Apps.
Use the Redux Store concept to manage state without using the Redux Library.
Write Selectors to compose views & use Selectors and store in Components.

Learning Server side Programming

Learn how to create a web server using express.
Learn server side routing & sub-routing techniques.
Learn how to use middleware to register custom routes & functions.
Learn how to use Passport.js and Bcrypt technology to do server side Authentication.
Learn how to create JWT tokens in node.js.
Learn how to secure server side REST APIs.

Learning Angular Debugging & Fixing Bugs

You will see & debug angular app in VS Code.
Learn can you debug both client and server together.
I will give you a couple of bugs in the Angular app to fix them.
I will show you in the live demo how to fix those Angular Bugs.

Learning Node.js & Express Debugging & Fixing Bugs

I will teach you how to debug server side node.js code in VS Code.
You will get Express, Node.js bugs to solve in this course.
I will teach you by showing a live demo on how to fix Node.JS bugs.

Learning Database Programming MongoDB

Learn how to install MongoDB on a Windows machine.
I will share with you a guide to installing Mongo DB on your own.
You will learn how to use Mongoose in Node.js to do server side validations out of the box.
I will teach you how to create models and write queries using Mongoose to communicate mongo db.
Learning Building & Deploying Angular App
I will teach you how you can deploy both Angular & Server side code locally and test.
You can follow the technique to deploy server side code in Windows, Linux or any type of servers.
Learn how to build an angular app in local using ng build command.
I will teach you how you can build an angular app for production deployment.
Learn how to manage Environment variables used for various servers.
I will teach you how to use the 'env file' to manage environment variables & constants.

Learning Heroku Cloud Technology ?

You will learn how to deploy production angular app to Cloud
I will demonstrate to you how to use Heroku.
Learn how to deploy your angular app in Heroku.
Learn how to deploy Node.js apps in Heroku.
I will teach you how to configure CI/CD in Heroku.
You will learn how to deploy node.js & angular app from GitHub To Heroku.
I will also teach you how to use the Heroku CLI on a local machine.
You will learn how to auto build and deploy in Heroku after pushing changes to GitHub.

Learning MEAN Stack

Angular (Client Side Technology )
Node.js (Server Side Technology )
Express (Server Side Technology )
Mongo Db (Backend Technology )
RxJS & Reactive Programming (Client Side Technology )
Redux style (Architecture )

Learning Tools & Software ?

You will get hands-on experience on the tools and software's that is currently used over big industries. Below are the list of tools you will be getting expertise:

VS Code
Git
Web Pack
Node.js
Express

What can I do After finishing this course? ?

After finishing this course you will have working PRO+ knowledge in Angular & Node.js. You will be able to write any Fullstack Angular app on your own. You will be able to give and crack any Angular interview. You will definitely board on to your next dream company.

Level

Beginners and Intermediate

Age Group

All Ages

Tags

Html, CSS, Angular, Node.js, Express, MongoDB, RxJS, Heroku, webpack, Git, VS Code, Debugging, REST API, JWT, VS Code, Programming, deployment, ci/cd, angular material, Flex

Who this course is for:

Student who wants to build e-commerce Angular project from scratch
Beginner-JavaScript Programmer who wants to become Angular developer
Beginner-Angular Programmer who wants to become lead or senior Angular developer

Mastering MEAN.JS: Fullstack Ultimate Course

What you'll learn

Explore related topics

Course content

Introduction1 lecture • 1min

Web Development Environment Setup on Windows Machine3 lectures • 10min

Creating New Angular App2 lectures • 25min

Integrating Angular Material2 lectures • 24min

Creating Product Module In Angular App5 lectures • 1hr 22min

Creating & Running Local Server using Express Node.js1 lecture • 43min

Creating Registration, Login & Logout Angular Components3 lectures • 1hr 52min

User Registration Web Api Creation and Integration2 lectures • 1hr 22min

Connecting Server to Mongo Database1 lecture • 28min

Saving User in MongoDB2 lectures • 39min

Requirements

Description

Who this course is for: