Full Stack Development

180-Hour Intensive Training Plan (6 Hours Per Day) Total Duration: 180 Hours Training Format: 6 Hours per Day Total Training Days: 30 Days Training Schedule Overview Daily Schedule: 3 Hours Classroom Learning 3 Hours Practical Lab Work

Course Instructor: Admin

₹7999.00

To enroll in this course, please contact the Admin

Contact Admin

Course Overview

The Full Stack Development course is designed to teach both frontend and backend web development within a 180-hour training period. The course begins with web development fundamentals such as the structure of HTML documents, the web request and response cycle, and semantic HTML for accessibility. Students then learn CSS for styling webpages, including layout techniques like Flexbox and Grid, along with responsive design using Bootstrap. After building a strong frontend foundation, the course introduces JavaScript programming concepts including variables, data types, loops, arrays, and functions. Advanced JavaScript topics such as closures, asynchronous programming, promises, and DOM manipulation are also covered. Students then learn React, a popular frontend framework, where they build component-based user interfaces using props, state, and hooks. Backend development is taught using Node.js and Express.js, where students learn to build REST APIs, manage routing, and implement authentication using JWT. Database management is covered through MongoDB and Mongoose. The program concludes with full stack integration, deployment, and CI/CD practices. Students build a complete MERN stack project such as an e-commerce website or blogging platform as their final project.

Schedule of Classes

Course Curriculum

25 Subjects

Introduction to Web Basics

Web request & response cycle

Critical Rendering Path (CRP)

HTML document structure

Common HTML tags

Lab Work

Create basic HTML webpage

Inspect request/response using browser dev tools

Use ChatGPT/Gemini to generate sample HTML code

Semantic HTML & Accessibility

Semantic HTML elements

ARIA roles

Block vs inline elements

Accessibility principles

Build accessible webpage

Add ARIA attributes

Use AI to improve accessibility suggestions

Lab Work

Build accessible webpage, Add ARIA attributes, Use AI to improve accessibility suggestions

CSS Basics

Selectors

CSS properties

Styling HTML elements

Lab Work

Style webpage using CSS

Use Cursor AI to refactor CSS

Version Control & Layouts

Git basics Git commands (init, commit, push) GitHub repositories Collaboration workflow

Lab Work

Create GitHub repository Push project using Git, Generate AI-based commit messages

CSS Specificity & Positioning

CSS specificity Selector hierarchy CSS positioning (relative, absolute, fixed)

Lab Work

Fix CSS conflicts Use AI to detect specificity issues

CSS Flexbox

Flex container Flex items Flexbox properties

Lab Work

Build flexbox-based layout Use AI to convert UI design to Flexbox

CSS Grid & Media Queries

Grid layout system Media queries Responsive layout basics

Lab Work

Create responsive webpage

Use Cursor AI to refactor layout

Responsive Design & JavaScript

Bootstrap grid system

Responsive utilities

Bootstrap components

JavaScript in browsers

JIT compilation

Global Execution Context (GEC), Call stack

Data types, Operators, Type conversion

If/else, Switch statements, Loops (for, while)

Array methods map, filter, reduce ES6 upgrades

Lab Work

Build responsive webpage using Bootstrap, Generate Bootstrap UI with AI

Write basic JS scripts, Use AI to visualize call stack

Create JS programs using variables

Build simple JS programs

Implement array transformations

Advanced JavaScript

Function types, Scope rules, Hoisting

Closures, Call stack behavior

Callbacks, Currying, Partial application

Object methods, Object.keys / values / entries, Spread & rest operators

Lab Work

Write function examples

Implement closure-based functions

Use AI to rewrite imperative code into functional style

Build object utility functions

Async JS & DOM

Event loop, Task vs microtask queue

Promise lifecycle, Async/await

DOM structure, DOM traversal

Event handling, Fetch API

Lab Work

Create event loop example, Generate async flowcharts using AI

Convert callback code into async/await using AI

Manipulate DOM elements

Fetch data from public API, Display data in webpage

React Development

React basics, Virtual DOM, Component-based architecture

Functional components, Class components

Props, State management

useState, useEffect

useRef, React Router, Nested routes

Lab Work

Create React project

Build React UI components

Build dynamic UI

Implement React hooks

Create multi-page React app

Backend Development

Node.js basics, Express framework, Middleware

REST APIs, Controllers and routers

bcrypt password hashing, JWT authentication, Role-based access

NoSQL databases, MongoDB Atlas, Mongoose schema

MERN stack integration CI/CD pipelines Environment variables Deployment strategies, Introduction to RAG for AI chatbot

Lab Work

Create HTTP server

Build CRUD API

Implement login system

Connect Node API with MongoDB

Connect React frontend with backend API, Deploy Full Stack project, Generate CI/CD config using AI

Final Major Project

E-commerce website

Task management system

Blogging platform

Chat application

React frontend Node/Express backend, MongoDB database, Authentication, API integration, Deployment

Course Instructor

Admin

371 Courses • 1565 Students