Document
What you'll learn

✔ MERN stack is a collection of technologies that enables faster application development.

✔ It is used by developers worldwide. The main purpose of using MERN stack is to develop apps using JavaScript only.

✔ This is because the four technologies that make up the technology stack are all JS-based.

Technologies you will learn

Curriculum designed by experts

48 hours
Cource Fee : ₹ 12000

➢ What is web development?

➢ How websites work?

➢ Advantages of learning web development

➢ History of web development

➢ ourse and Projects Overview

➢ What is HTML?

➢ Structure of Webpage

➢ HTML Tags

➢ Adding and formatting texts, title, paragraph, body

➢ Lists – Ordered/Unordered

➢ Images

➢ Forms

➢ Node setup

➢ Links

➢ Tables

➢ Iframes, Videos

➢ Anchor tags

➢ HTML Divs

➢ CSS Introduction

➢ Inline vs Internal vs External styling

➢ CSS Display

➢ Project 1 - To-do App – Frontend using basic HTML/CSS

➢ CSS Backgrounds, Borders, Margins, Padding

➢ CSS Font Styling

➢ Stylings Lists

➢ Styling Tables, Forms

➢ Gradients

➢ Font Awesome

➢ Tool tips

➢ Buttons

➢ Transitions, Transformation, Animations

➢ Box sizing

➢ Flex

➢ Grid

➢ Project 1 - To-do App – Enhance Frontend using CSS

➢ Bootstrap containers

➢ Tables, Images, Colors

➢ Alerts, Buttons

➢ Spinners, Cards

➢ Pagination, Drop Down

➢ Carousel

➢ To-do App – Develop To-do App Frontend using Bootstrap

➢ GitHub Overview

➢ Introduction to JavaScript

➢ Variables, scoping, Data type

➢ Strings and Numbers

➢ Operators and loops

➢ Functions

➢ Project 1 – Add Functionalities to To-do App

➢ Arrays

➢ Linked List

➢ Stacks

➢ Queues

➢ Maps

➢ Hashing

➢ Understanding and working with DOM

➢ Developer tools in Browsers

➢ JQuery

➢ Project 2 – Add Functionalities to Blog

➢ Prototypes

➢ Closures

➢ Local Storage

➢ Ajax

➢ Promises

➢ Project 3 – Dice Roller Game using Animation and JavaScript

➢ ES5 vs Es6 vs Es7

➢ Event loop in JavaScript

➢ React Intro

➢ Install node

➢ Create an app using create-react-app

➢ Understanding basics of react app

➢ Understanding JSX

➢ Understanding virtual DOMS, Single page apps

➢ React Intro

➢ React Lifecycle

➢ States

➢ Class components vs functions components

➢ Event handling

➢ Props

➢ Building a basic Forms using React

➢ Project 4 – Build Blog using React

➢ Routes

➢ Conditional Rendering

➢ Pure Components

➢ High Order components

➢ ontrolled vs Uncontrolled components

➢ Redux

➢ Babel, webpack

➢ Add Redux in a Project and build using webpack

➢ Creating a Mock API Server

➢ Axios

➢ Server-Side Rendering

➢ Project 4 - Fetch Data in Blog from an API

➢ Creating a Mock API Server

➢ Simple Server

➢ Response Types – HTML, JSON

➢ Routing

➢ Express Intro

➢ Make a call from frontend to server

➢ Project 4 – Create API to fetch blogs from DB

➢ Creating a Mock API Server

➢ Express Params and Query String

➢ Express Middleware

➢ API Authentication

➢ JWT token, Passport.js

➢ roject 4 – Add API Authentication to Blog App

➢ Creating a Mock API Server

➢ SQL vs NO SQL

➢ MongoDB / DynamoDB overview

➢ Installing MongoDB

➢ Connecting and inserting data

➢ pload / Modify Tests of Online Quiz System using DynamoDB

➢ Tools for code review

➢ Standard coding conventions

➢ Firebase

➢ Deploy using Netlify

➢ Deploy using AWS Ec2

➢ Get code reviewed by Software developers and deploy projects

➢ GTM

➢ Google Analytics

➢ Facebook analytics

➢ Webengage

Pre Requisite :

✔ you should have a basic understanding of fundamental languages used by the browser and the server.

✔ You should be confident in designing and stlying web pages using HTML & CSS.

✔ Fundamental concepts of Javascript should be clear and should also be familier with DOM(Document Object Model) in browser.

✔ Basic understanding of Node/express will speed up the learning process but is not recommended.

...
This course includes:

✔ 48 hours on-demand video

✔ 50 articles

✔ 95 downloadable resources

✔ 13 coding exercises

✔ Full lifetime access

✔ Access on mobile and TV

✔ Assignments

✔ Certificate of completion

✔ Closed captions