Preview MERN full-stack web development course

Welcome, Introduction

Course material

Prerequisites

Get your certificate

Welcome to the courses

Download the guides

[GUIDES] 15+ Interview resources, guides, roadmaps

All guides for you

15+ Interview, Revision guides and notes

25 Full stack projects

12+ Awesome AI guides

HTML, CSS Intro and mastery

HTML Mastery

0 something important

1 overview

2 what is html

3 editor

4 First Program

5 tags in capital or small

6 easy way to make structure

7 heading

8 elements

9 paragraph

10 line break

11 hr tag

12 pre

13 bold

14 strong

15 italics

16 emprasized

17 underline

18 small

19 mark

20delete

21 insert

22 subscript

23 superscript

24 blockquote cite

25 quotations

26 abbriviation

27 address

28 cite

29 bdo

30 comments

31 links

31 links attribute

32 parent , tp

33 absolute vs relative

34 link with title

35 image

36 src

37 alternate

38 favicon

39 what is table

40 table tag

41 explanation

42 not so important

43 vertical tables

44 colspan

45 rowspan

46 ol and ul

47 dl

48 ordered type

49 block

50 inline

51 div

52 span

53 iFrame

54 File Path

55 head and meta

56 code

57 keyboard

58 sample

59 pre

60 var

61 section

62 article

63 header

64 footer

65 nav

66 aside

67 symbol

68 video

69 video attribute

70 audio

71 youtube

72 Forms

73 selects

74 select size

75 textarea

76 button

77 fieldset

78 more on inputs

CSS Mastery

0 Overview

1 what and why css

2 css folder

3 external , internal , inline

4 comments

5 selectors

6 universal selector

7 grouped selector

8 color

9 rgba

10 hex

11 hex short

11 hex short 2

12 hsl

13 hsla

14 backgrounds

15 borders

16 box model

17 margin padding

18 outline

19 text

20 vertical align

21 text decoration

22 tranform

23 more on text

24 text shadow

25 fonts

26 Links

27 lists

28 more on list

29 tables

30 block inline

31 none,hide

32 . Display

33 . FlexBox

34 . Media Query

35 . Grid

36 . Transform

37 . Box Sizing

[Essentials] HTML , CSS and JS (one shot)

Master HTML Essentials Crash Course for Quick Learning

Master CSS Essentials Crash Course for Quick Learning

Master JS Beginners Essentials Crash Course for Quick Learning

JavaScript intro and mastery

js1-Intro to JS

js2-Variables, loops, functions

js3-Basic weather app in JS and AI tools

js4-Async, await example 2

js5-Understanding closures and other JS topics

js6-Learning debouncing

js7-Error handling and checking Claude for JS

js7-Mastering V0 and AI tools for Javascript

js8-conditional-rendering

JS in detail - mastery

3 . Comments

4. Variables

5 . Implicit Type Conversion

7 . Arithmetic Operator

8 . Incr _ Dec

9 . Comparison Operator

10 . == vs ===

11. Logical Operator

12 . Conditional _ if , if else , nested if

13. else if

14 . Switch

15 . Loop _ for , while , do while

16 . Functions

17. Array

18 . map function

20 . push , unshift

21 . splice

22 . slice

23 . For in For OF

26 . Destruct

24 . Multidimensional Array

25 . copy

27 . objects

28 . Objects Inside Array

React JS - introduction

1 Introduction to React JS

2 Structure, installation, overview

3 Build lots of landing pages

4 JSX mastery

5 Different components and reusing

6 Props Children and parent

7 Hooks intro

8 Hooks mastery and interview prep

9 Conditional rendering and making projects

React JS in detail - part 1 - Complete run through

React part 1 - Introduction and Folder structure

React part 2 - Components

React part 3 - Introduction to JSX

React part 4 - Introduction to Components, Props, Projects

React part 5 - Introduction to Hooks - useState, useEffect, Custom

React part 6 - Introduction to state management - Context API, useContext

React part 7 - Introduction to useReducer

React part 8 - React router, error #404, and Form Validation

React part 9 - Redux Toolkit explained

React JS in detail - part 2 - hooks

useState

useState Example #2

useEffect

useEffect vs useMemo

useContext

useimperativeHandleHook

useLayoutEffect

useRef

useRef DOM example

useRef Example 2

Custom Hook

[NEW] Complete React JS projects

Shopping Cart

BMI Calculator

Calculator App

Expense Tracker

To Do App

Weather App

Link Previewer

Complicated Counter

Select all

Text TO Document

Infinity Scroll

Link Previewer

Transfer List Project

Form Validation

[NEW] Master Frontend quickly with AI

HTML complete course

CSS complete course

JavaScript complete course

React complete course

Next JS full course

Setup, Git, GitHub, Pages, Deploy

Introduction to Git

Intro to Git, GitHub, and Workflow

Install and Setup - Git and GitHub

Visualize git with this tool

Github cheat sheet

Creating Repository, GitHub Pages, Deploying and Pushing code

Git summary and how to learn [new]

Node - Express JS introduction

node-express-intro

node-express-2-explanation

node-express-3-mongodb

node-express-4-exploring-more

node-express-5-code

More about Node JS

Introduction to Node JS , Modules , Local Modules

Built-in Modules in Node JS

Npm, nodemon, package.json etc

Event Loop, Events , Streams

Node JS mastery

Learn Node JS in One Video

Timestamps

1 _ Node JS and How to Install

2 _ First Program (REPL and CLI)

3 _ Modules

4 _ Local Modules

5 _ Import _ Export

6 _ Multiple Exports

7 _ Module Exports vs Exports

8 _ ES Module import_export

9 _ Build in Modules

10 _ OS Module

11 _ Path

12 _ FS Module

13 _ How Web Works _

14 _ Create Node Server

15 _ Npm

16 _ Nodemon

17 _ GitIgnore

18 _ Event Loop

19 _ Event Loop Practice

20 _ Events

21 _ Streams

Node JS + Express JS speed run

Creating server using Express , Express Routes

Json, Params, Query

CRUD Operations - backend

Full stack interview questions (bonus)

Databases - MongoDB speed run

Introduction to MongoDB and NoSQL database

Performing CRUD operations using MongoDB

Complete Backend development in detail - Node, Express, Mongo DB

Node JS in detail

Express JS in detail

Mongo DB in detail

Deploy your projects

GitHub Pages Deploy

Netlify Deploy

Vercel Deploy

[Quick Project] MERN stack project - User Authentication Application

Learn user signup, login, authentication using useContext - React

Learn user signup, login, authentication using MERN stack

Learn authentication using React and Firebase

[Detailed Project] MERN stack project - Ecommerce App

Ecommerce app part 1 - Setup , Server , Mongodb and userModel

Ecommerce app part 2 - userctrl , userrouter , cokkies , jwt token

Ecommerce app part 3 - register , login , logout ,authorization

Ecommerce app part 4 - define a category (CRUD)

Ecommerce app part 5 - define a product (CRUD)

Ecommerce app part 6 - filtering , pagination , sorting , limitations

Ecommerce app part 7 - client side - navbar

Ecommerce app part 8 - client side (products), context api , fetching

Ecommerce app part 9 - client side (details page)

Ecommerce app part 10 - client side (login , logout , admin features)

Ecommerce app part 11 - client side (Add to cart)

[SOURCE CODE]

[Detailed Project] Full stack project - Youtube Clone

Youtube project part 1 - Project setup, Home Navbar

Youtube project part 2 - Add a Sidebar to the UI

Youtube project part 3 - Youtube Api Setup, Redux Toolkit

Youtube project part 4 - useDispatch, useSelector, getHomePage

Youtube project part 5 - parseData, parseVideo Duration, convertRawtoString

Youtube project part 6 - timeSince, Spinner Loading, Card

Youtube project part 7 - Search, Search Card

Youtube project part 8 - Scrollbar, Watch, Additional features

[SOURCE CODE]

[Detailed Project] MERN stack project - BookMyShow

0 - Overview

1 - Setup , Home and Select Movies

2 - Home CSS, components , time schedule

3 - Select Seats

4 - Last Booking Details

5 - Context , Local Storage , active inactive

6 - slots context , seats context

7 - Book Button , Backend , Server , ConnectToDB

8 - GetData , PostData , updating lastBookingDetails

[SOURCE CODE]

[Detailed Project] MERN stack project - Gmail app

mernstack-gmailclone-main

P-1 Project Setup & Building Navbar+Sidebar+Inbox Pages

P-2 Understand React-Router-Dom and Redux Toolkit

P-3 Building Login & Signup Page + Create server & Connect with MongoDB Atlas

P-4 Schema Design + User Controllers & Routes for Login & Signup + Middleware

P-5 Creating Email Controller & Api End Points ( Create, GetEmail, Delete Email)

P-6 APi Integration with Frontend (Login+Signup+Fetch, Create & Delete Email)

P-7 Persist Our Store + Searching Emails + Protecting Routes

[Detailed Project] MERN full stack project - Expense Tracker

Expense Tracker Demo P 1

Backend Project Setup P 2

Database connection + Schema Design + Login+Signup Controllers and APIs P 3

Auth middleware + Add, Get, Update, Remove Expenses & mark as done Controllers + Apis for expenses P

Api Testing + Setup React Vite With Shadcn UI + Integrate Login & Signup API P 5

Building Create Expense & Filter Page + Configuring Redux Toolkit P 6

Fetch All Expenses Delete & Update Expense + Persist Redux Store P 7

[Quick Project] MERN Stack - Social Media (Guide)

social-media-master [zip code file]

How to build Social Media Full Stack App - complete pdf guide

Building a Social Media App with MERN Stack - Walkthrough video

[Guide] MERN Stack -Hotal Application (Guide)

MERN-Booking-App-main (1)

How to create a Hotel booking app with MERN stack

[Guide] MERN Stack - Chat Application (Guide)

How to create a real-time Chat Application with MERN stack

Detailed videos are coming soon!

[Guide] Stripe and Firebase Project : ECommerce Application

Ecommerce Application with React, Redux, Stripe and Firebase

[Guide] Full Stack Website : Interio (Guide)

Interio_Full_Stack

Preview - MERN full-stack web development course