MEAN STACK COURSE SYLLABUS

SECTION 1: HTML 5

 Introduction - Web
 What are the different Types of Web Apps overview?
 Introduction to HTML
 Define HTML Structure
 Difference between Tag vs Element
 Difference between Semantic vs Non-semantic elements
 Difference between Block level elements vs Inline elements
 HTML Elements
 HTML Forms & its Attributes
 HTML Input Elements
 HTML Global Attributes
 HTML Element Specific Attributes

SECTION 2: CSS & Bootstrap

 What is CSS?
 Understanding the CSS Syntax.
 CSS Selectors
 How To Add CSS in HTML
 CSS Colors & Backgrounds
 CSS Borders, Margins, Padding, Height and Width
 Responsive Web Design – Media queries
 What is Bootstrap?
 Get Start with Bootstrap
 Containers
 Grid System
 Structure of a Bootstrap Grid
 Bootstrap Colors
 Bootstrap Tables
 Bootstrap Jumbotron
 Bootstrap Alerts, Bootstrap Buttons

www.credosystemz.com
SECTION 3: JavaScript

 Introduction – Javascript
 JavaScript Events
 JavaScript Functions
 Inbuilt methods in JS
 Arrays in JavaScript
 Objects in JavaScript
 Conditional and loops in JavaScript
 HTML DOM Manipulation

SECTION 4: TypeScript

 TypeScript Introduction
 TypeScript Environment Setups
 Variables in TS
 Datatypes in TS
 OOPS in TypeScript
 Features in TS

SECTION 5: Angular Introduction

 Angular- Definition
 Difference between Framework & Library?
 History of Angular and its versions.
 Why Angular?
 What are the Features of Angular
 Define Single Page Application
 What is the Difference between SPA & Traditional Application?
 Define MVC
 How MVC works in Client & Server sides?

www.credosystemz.com
SECTION 6: Angular Environment setups

 What is Angular CLI?

 What is the Purpose of the CLI?
 Angular CLI installation.
 CLI vs Without CLI Overview.
 Create an Angular App by using CLI.
 Compiling the Angular App & Open it in a browser.
 Angular app Bootstrapping process.
 About Angular libraries
 Brief explanation about the structure of the Angular App.

SECTION 7: Main Building Blocks of Angular

 An Overview of the below Main Building blocks of Angular

 Modules
 Components
 Decorator
 Metadata
 Templates
 Data binding - Directives
 Services
 Dependency Injection.

SECTION 8: Angular Modules

 Angular Module Overview.

 Define the Importance of the Module?
 Why Modules?
 Root Module, Core Module, Feature Module and Shared Module -
Overview.
 How to create Angular Modules?
 @NgModule Decorator & its Meta data properties - Overview

www.credosystemz.com
SECTION 9: Components

 Angular Component - Overview.

 @Component decorator & its Meta data properties.
 Component’s Structure overview.
 What are the ways to render a Component in the view?
 Component Lifecycle Hooks.
 Nested or Parent & Child Component - Overview

SECTION 10: Data Binding, Property Binding, Event Binding & 2-way Data
Binding

 Data Binding Introduction

 Define String Interpolation.
 Property Binding - Overview.
 what is Custom Property Binding?
 Overview of Event Binding.
 String Interpolation VS Property Binding
 Two-way Data Binding
 Implementing the 2-way Data Binding

SECTION 11: Services

 Introduction - Service.
 Importance of Service.
 How to create Services in Angular?
 What are the ways to Provide Services in Angular?
 Dependency Injection - Overview.
 How to use Dependency Injection?
 What is @Injectable()?

SECTION 12: Directives

 Directives - Introduction.
 Component VS Directives
 What are the Different kind of Directives available in Angular?

www.credosystemz.com
  Difference between Structural & Attribute Directives.
 Overview of All Structural & Attribute Directives.
 @Input decorator and its methods.
 What is ElementRef and its purpose?

SECTION 13: Components Communication

 Overview of Components Interaction.

 Component Interaction from Parent to Child.
 Component Interaction from Child to Parent.
 @ViewChild decorator overview
 @Input & @Output decorator overview

SECTION 14: Reactive Form in Angular

 What is Reactive Form?

 Difference between Template Drive & Reactive Form
 What is form group & form control?
 How to sync view & Reactive form TS?
 What is Patch Values & Set Values?
 How to get Reactive from Values?

SECTION 15: Service and Dependency Injection in Angular

 Service in Angular
 Create & configure Service in Angular.
 How to do Dependency Injection in Angular?
 Define Singleton Object

SECTION 16: Routing in Angular

 What is Routing?
 How Routing makes our App into SPA?
 How to configure Routing in an Application?
 Load our components dynamically based on url path.
 How to create Child Route?
 Navigating to other links programmatically.

www.credosystemz.com
  Passing Parameter to the Routes.
 Client-side authorization using Route Guard

SECTION 17: HTTP & Observable in Angular

 HTTP Client in Angular.

 REST API - Overview
 How to establish HTTP request to Server side.
 How HTTP Mechanism works?
 What are the methods available in HTTP?
 Define Observable & Observer
 What are the call back methods available in Observable?
 Creation of a Custom Observable
 Define next(), error() and complete()
 How to send Query Params & Custom Headers?
 How to connect any backend & APIs?

SECTION 18: Authorization in Angular & JWT

 Client side Authorization vs Server side Authorization.

 Server side Authorization by using JWT Token.
 Set JWT Key Expiry time.
 HTTP interceptors - Overview.
 How to configure HTTP interceptors?

SECTION 19: Real-time Project in Angular

During the course we will take one Real-time E-commerce application and apply
all the above sections into the project. In the project Front-end will be in Angular
and Back-end will be in Node JS. On top of the Node JS we will write Express JS
as a REST Api. For Database, we choose MongoDB for CURD Operations.

SECTION 20: Getting Started with Node Js

 Welcome Preview
 What is Node Preview
 Node Architecture Preview

www.credosystemz.com
  How Node Works Preview
 Installing Node Preview
 Your First Node Program

SECTION 21: Understanding Node Module System

 Introduction
 Creating a Module
 Loading a Module
 Modules and modularity
 Global Object
 OS Module
 Path Module
 File System Module
 Events Module
 HTTP Module

SECTION 22: Node Package Manager

 Introduction to NPM
 Installing a Node Package
 NPM Packages and Source Control
 Semantic Versioning
 Registry Info for a Package
 How to install specific version of the package
 How to update Local Packages
 Uninstall the packages
 Dev Dependencies
 Publishing Package

SECTION 23: Asynchronous Programming

 What is Asynchronous Programming in JavaScript?

 Synchronous vs Asynchronous
 JavaScript EventLoop
 Callbacks

www.credosystemz.com
  Callback Hell
 Promises in JavaScript
 Promise Chaining
 Async Await

SECTION 24: Rest API & HTTP

 What is HTTP
 Understand how HTTP works?
 List of HTTP response codes
 HTTP Module in Node
 HTTP Methods - GET, POST, PUT & DELETE
 Processing Form Data
 Sending response back to Server

SECTION 25: Understanding Express JS

 What is Express JS?

 Installing Express JS
 Creating HTTP Server
 Nodemon
 Environment Variables
 Routing
 Route Parameters
 Handling Multiple Routes
 Input Validation
 Handling HTTP Method - Get, Post, Put & Delete using Express

SECTION 26: MongoDB & Mongoose

 What is MongoDB
 MongoDB Advantages
 Installing MongoDB
 Mongoose ODM
 Schemas
 Models

www.credosystemz.com
  Documents
 Saving a Document
 Querying Documents
 Logical & Comparison Query Operators
 Regular Expressions
 Counting
 Pagination
 CRUD Operations in MongoDB using Mongoose and Express

SECTION 27: Data Validation in MongoDB

 Understanding Validation in MongoDB

 Built-in Validators
 Custom Validators
 Validation Errors

SECTION 28: Authentication and Authorization

 Introduction
 User Model
 User Registration
 Hashing Passwords
 Authenticating Users
 JSON Web Token
 Generating Authentication Tokens
 Setting Response Headers
 Auth Protect Middleware
 Protecting Routes
 Role-based Authorization

SECTION 29: Handling Errors

 Introduction
 Express Async Errors
 Logging Errors

www.credosystemz.com
SECTION 30: Deployment

 Preparing the App for Production

 Adding the Code to a Git Repository
 Setting Environment Variables

SECTION 31: Real Time Projects

 5+ Real-time projects (Full stack coverage)

 Setup Git for local repository
 Create a GitHub account
 Sync the code base with GitHub repo
 Firebase Hosting Overview
 Setting up Firebase in local
 Host your project in Firebase

SECTION 32: Placements

 Build your Professional Resume

 Update LinkedIn Profile
 Interview based Training – GD, Tech round, HR panel
 Minimum 5 Mock interviews before Real interview
 100% Placement Guaranteed
 Join your Dream Job

www.credosystemz.com