Get In Touch

Full Stack Web Development

Duration

32 Lectures

Level

Beginner → Intermediate

Approach

30% Theory + 70% Hands-on

Final Outcome

Students build and deploy a complete full-stack web application

TECHNOLOGY STACK

Category

Technology

Frontend

HTML5, CSS3, JavaScript, React.js

Backend

Node.js + Express.js

Database

MongoDB

API

REST API

Authentication

JWT + Password Hashing

Tools

Git, GitHub, VS Code, Postman

Deployment

Vercel/Netlify + Render/Railway/MongoDB Atlas

MODULE 1 Web & Development Fundamentals | Lectures 01–04

Lecture

Topic

Practical Work

01

Introduction to Full-Stack Development

Understand frontend, backend, database, APIs and how they communicate

02

How the Web Works

HTTP/HTTPS, DNS, browsers, servers, requests & responses

03

HTML5 Fundamentals

Build a structured webpage

04

Advanced HTML & Forms

Forms, validation, tables, semantic HTML

Learning Outcome

Students understand the complete architecture of a modern web application and can create properly structured HTML pages.

 

 

MODULE 2 CSS & Responsive Design | Lectures 05–08

Lecture

Topic

Practical Work

05

CSS Fundamentals

Selectors, colors, fonts, box model

06

CSS Layout

Flexbox, positioning and layouts

07

CSS Grid & Responsive Design

Build responsive layouts

08

Modern UI Design

Responsive navbar, cards, forms and landing page

Mini Project

Responsive Personal Portfolio Website

MODULE 3 JavaScript Fundamentals | Lectures 09–14

Lecture

Topic

Practical Work

09

JavaScript Fundamentals

Variables, data types, operators, conditions

10

Functions, Arrays & Objects

Create reusable JavaScript logic

11

DOM Manipulation & Events

Interactive webpages

12

Modern JavaScript

ES6+, destructuring, spread, modules

13

Asynchronous JavaScript

Callbacks, Promises, async/await

14

Fetch API & JSON

Consume a real public API

Mini Project

Weather / Movie / News API Application

MODULE 4 Git, GitHub & React | Lectures 15–20

Lecture

Topic

Practical Work

15

Git & GitHub

Repository, commit, branch, merge, push/pull

16

Introduction to React

Components, JSX and project structure

17

React Props & State

Build reusable components

18

React Hooks

useState, useEffect and component lifecycle

19

React Forms & Events

Build registration/login forms

20

React Routing

Multi-page SPA using React Router

Mini Project

React Task Management Dashboard

 

MODULE 5 Backend Development | Lectures 21–25

Lecture

Topic

Practical Work

21

Node.js Fundamentals

Node runtime, npm, modules

22

Express.js

Create an Express server

23

REST API Development

GET, POST, PUT, DELETE

24

Middleware & Error Handling

Build reusable middleware

25

API Testing with Postman

Test and document REST APIs

Practical Project Task Management REST API

  • GET /api/tasks
  • POST /api/tasks
  • GET /api/tasks/:id
  • PUT /api/tasks/:id
  • DELETE /api/tasks/:id

MODULE 6 Database & Authentication | Lectures 26–29

Lecture

Topic

Practical Work

26

Database Fundamentals & MongoDB

Collections, documents, CRUD

27

MongoDB with Node/Express

Connect backend to MongoDB Atlas

28

Authentication & Authorization

Register, login, password hashing

29

JWT Authentication

Protected routes and user sessions

Security Topics

  • Password hashing
  • JWT
  • Authentication vs authorization
  • Environment variables
  • Input validation
  • CORS
  • Basic API security
  • Secure error handling

MODULE 7 Full-Stack Integration | Lectures 30–31

Lecture

Topic

Practical Work

 

30

Connecting React + Express + MongoDB

Complete frontend/backend integration

31

Deployment & Production

Deploy frontend, backend and database

Integration Flow

React Frontend → REST API → Express Backend → MongoDB Atlas

MODULE 8 Final Project & Presentation | Lecture 32

Lecture

Topic

Practical Work

32

Final Project Presentation & Evaluation

Demonstrate, test and present complete application

1. E-Commerce Platform

  • User registration/login
  • Product catalog
  • Search/filter
  • Shopping cart
  • Orders
  • Admin dashboard
  • REST API
  • MongoDB

2. Learning Management System

  • Student registration
  • Instructor accounts
  • Courses
  • Lessons
  • Enrollment
  • Progress tracking
  • Dashboard

 

4. Event Management Platform

  • Create events
  • Event registration
  • User accounts
  • Admin panel
  • Event dashboard

ASSESSMENT STRUCTURE

Total: 100%

Component

Weight

Weekly practical tasks

20%

Mini projects

15%

GitHub activity

10%

Quizzes/technical assessments

10%

Final Full-Stack Project

35%

Final Presentation

10%

Total

100%

WHAT STUDENTS WILL BE ABLE TO DO AFTER 32 LECTURES

✔ Build responsive websites with HTML/CSS

✔ Program interactive applications using JavaScript

✔ Develop modern React applications

✔ Build REST APIs with Node.js & Express

✔ Design and use MongoDB databases

✔ Implement authentication and authorization

✔ Connect frontend, backend and database

✔ Test APIs using Postman

✔ Use Git and GitHub professionally

✔ Deploy a full-stack application

✔ Understand basic web application security