Build Modern MEAN Stack Web App

Modern MEAN Stack web Application development with Node.js, Angular, Nestjs, MongoDB

4.20 (12 reviews)
Udemy
platform
English
language
Web Development
category
instructor
Build Modern MEAN Stack Web App
87
students
11.5 hours
content
Dec 2020
last update
$44.99
regular price

What you will learn

NestJs Fundamentals

Typescript Fundamentals

Angular Fundamentals

Build RESTFUL APIs with NestJs and MongoDB

Build RestFUL APIs with NestJs and Mysql

Authentication and Authorization using PassportJs

Add Documentation for your APIS

Build Single Page frontend app with Angular

CRUD Application with Angular

Authentication in Angular Application

Description

The term MEAN stack refers to a collection of JavaScript based technologies used to develop web applications. MEAN is an acronym for MongoDB, ExpressJS, Angular and Node.js. From client to server to database, MEAN is full stack JavaScript.

The main reason for choosing the MEAN stack over others is because of the use of a common language for both client-side and server-side. Since, all these technologies are written in JavaScript, your web development process becomes neat. Node.js is a platform that brought JavaScript implementation on the server-side. With Angular  using JavaScript on the front-end, it becomes easier to reuse code from back-end to front-end.

MEAN stack offers a modern approach to web development. It also makes use of the power of modern SPAs (single-page applications), which does not require entirely refreshing a web page for every server request like most traditional web applications do. Today there is a trend to develop multiple frameworks that correspond to a single programming language and form a full-stack solution. But, as of now, using MEAN stack is a very effective approach to web development.

In this course, we are going to build our backend application Nest.js. Nest.js is a Node.js framework. It is built on the top of Express and Typescript.

Nest.js is a progressive Node.js framework for building efficient, reliable and scalable server-side applications. NestJS is a server-side (backend) application framework beautifully crafted to support developers productivity and make their lives happier. Well, it's not only a framework, it's an enabler of entering the world of advanced engineering concepts such as Domain Driven Design, Event Sourcing, Microservices architecture.

I spent a good few years in my career developing large scale apps and it didn’t let me down any single time. It’s well written, having quality as an objective, modular web framework with a good documentation, delivering nice developer experience. Exactly the same way I’d describe Nest.

NestJs is built on the top of Typescript and Express.js. It also combines some elements of Object Oriented Programming and functional programming.

Here comes NestJS, a framework which is fully written in TypeScript (it supports JS too, but types are good), it’s easily testable and brings in all the necessary stuff you always think about but you don’t know what to choose.

Why NestJs?

NestJS doesn’t try to limit you to a particular way of doing things, it just provides the tooling you need. It doesn’t try to reinvent the wheel, it utilize existing tools you already know. For example, it uses express behind the scenes which makes your app compatible with the majority of express middlewares.

Here are some good reasons why NestJS shines:

  • Dependency Injection — NestJS provides DI straight out of the box, increasing efficiency, modularity and testability of applications.

  • Modularisation — NestJS provides a modular structure for organizing code within the same domain boundary into separate modules.

  • Flexibility — NestJS provides structure, which helps large teams build complex applications and yet comes in as lightweight as possible, so how you want to build is your choice.

  • Familiar APIs you already know — NestJS is heavily inspired by Angular, it is also quite similar to much established frameworks like Spring and .NET. This provides a shorter learning curve and lower entry threshold for developers.

  • Community — NestJS is the fastest rising framework, already with 14K stars surpassing HapiJS. Also, with NestJS leveraging on the Angular way of doing things, things can only get better for the community.

In this course, I will teach you the foundations/fundamentals of NestJs. I will teach you how to build RESTFUL APIs step by step. You will also learn how to plan, design and deploy APIs. I have also another separate section of GraphQL.

What you are going to learn in this course?

  • Typescript Fundamentals

  • NestJs Fundamentals

  • Angular Fundamentals

  • Build RESTFUL APIs with NestJs

  • Connect REST APIs with Angular

  • Build Frontend with Angular

  • Authentication on Angular

  • Authentication on Backend Application

Content

Typescript Fundamentals

Typescript Steup
Basic Types
Types in Typescript
Operators, Decisions and Loops
Functions
Interfaces
Classes
Modules
Generic Types
Generics in more depth
Introduction to Decorators
Arguments in Decorator
Configurable Decorator using Decorator Factory
Property Decorator
Parameter Decorator
Class Decorator

NestJs Fundamentals

Getting started with NestJs
Routing in NestJs
Access Request Object
Define Resources
Status Code, Redirection and Route Parameters

NestJs CRUD

Module Introduction
Create Post Endpoint to Save Record in Array
Request Payload in NestJs
FindAll and Delete Endpoint

Validation and Pipes

What are pipes
Add Validations using ValidationPipe
Understand How ValidationPipe works

Middlewares

What are Middlewares
Create Custom Logger Middleware
Creating HTTP Exception Filter

Interceptors

What are Interceptors
Create Interceptor to Transform the Response

Database

Connect NestJs to Mysql using TypeORM
Create a TypeORM Entity
Save new record in MySQL Database Table
Get, Update, and Delete Record

Relations

Adding One to One Relation between Entities
CRUD with One to One Relationship
One to Many Relationship
Many to Many Relation

Connected with Mongodb

Connecting NestJs App with MongoDB

Authentication

Intro to Authentication
Implement User Signup Feature
Implement Login and Send JWT Token
Introduction to PassportJs
Authenticate User using Passport-JWT Strategy
Install and Configure Swagger
Add Documentation for Endpoints

Angular Fundamentals

Setup New Project
Angular Components
Angular Modules
Data Binding
Event Binding
Directives
Pipes
Routing Basics
Services
Fetch Data from External API using HttpClient
Creating Template Driven Forms
Reactive Froms

Building Frontend with Angular

Project Setup
Routing Setup
Intro to Lazy Loading
Implement Lazy Loading
Create Product List Layout
Create Generic API Service
Creating Models
Fetch Data from Backend API
Render List Data using NgFor
Build a Form to save Record
Building Reactive Forms
Resolve Form Value Issue
Send Post Request using Reactive Forms
Setup Routing For Edit Product
Creating Method in Service to Update Product
Set Data to Reactive Form
Update Record using Reactive Form
Perform Delete Operation
Fix Param issue
Form Validations

Authentication on Frontend

Setup Backend
Creating Authentication Form
User Login
Fix Signup and Login button title
Signup User Implementation
Saving Token to Localstorage
Fix Logout Link
View User Profile
Append JWT Token using HttpInterceptor
Handle Token Expired Condition
Understanding Subjects and Subscription
Fix Logout and Profile Route after LoggedIn
Securing Private Route with Guards

Reviews

Roma
January 14, 2021
It's an amazingly well organized detailed course. This class is an incredible value, it's in-depth and covers a breadth of topics.All concepts were cleared with clarity.

Coupons

DateDiscountStatus
12/28/202087% OFF
expired

Charts

Price

Build Modern MEAN Stack Web App - Price chart

Rating

Build Modern MEAN Stack Web App - Ratings chart

Enrollment distribution

Build Modern MEAN Stack Web App - Distribution chart
3689646
udemy ID
12/8/2020
course created date
12/28/2020
course indexed date
Bot
course submited by