Session 1. Intro.

• Overviews of Tools & Tech Stacks.

• Explain the Syllabus & Projects.

• Setup and Vscode & figma.

• Explain About Web development Why,What,How.

Session 2. Understanding the Need of Website Site Requirements.

• Research, Refer,

• Choosing ,Color, typography,images

• Redesign landing page with Responsives

Session 3. Intro of Html & Css:

• What is Html & Css

• Usage of tags & elements

• Purposes of Css

• Import the media Packages

• Types of Css & Selectors

• Styling and Adjust the layouts & Elements

Session 4. Creating the landing Page:

• Using List tag to Create a Navbar (With Css Positions Properties)

• Adding Background Images

• Create a Banners Section

• Create a Cards Sections (with Css Display Properties)

• Types of Css & Selectors

• Forms & Tables

Session 5. Creating a Multi Page Websites:

• Create Multipage

• Using Anchor tag to Navigate to another Page

• Using Media Query to Adjust the Display

• Make Some Pop Animations using Keyframes

Session 6. Intro:

• What is Bootstrap? Why use it?

• Bootstrap Setups your file

• Understand the Bootstrap Stylings

• Add Components

Session 7. Create Mobile Friendly Websites :

• Creating responsive layouts using the grid system

• Bootstrap Setups your file

• Understanding rows and columns

• Add Components

• Create Custom Components

Session 8 . Intro to JavaScript for Dynamic Web Projects:

• Understanding JavaScript and its role in modern web development?

• Learning the basics: Variables, data types, and operators in a project context

• Adding dynamic behaviors to your web pages using functions

Session 9 . Making Your Web Pages Interactive :

• Updating text dynamically on a webpage using the DOM

• Adding interactive features like button clicks and other user-driven events

• Validating user inputs on forms with conditional statements

• Creating looping logic for managing repetitive tasks, like number-based operations.

Session 10 . Modern JavaScript Features for Real-World Applications.

• Using arrow functions to simplify data processing, such as mapping lists

• Connecting to external services and displaying data through API integration

• Leveraging template literals to format and display dynamic content effectively.

Session 11. Getting Started with React

• Introduction to React: Why and where we use it in projects.

• Node Setup

• Building your first React application

• Understand the Root Cross of React

• Creating reusable JSX components for your project

Session 12. Building a Multi-Page React Application

• Passing project-specific data through props

• Setting up navigation and routing for multi-page functionality

• Leveraging React Hooks to manage component behavior

Session 13. Creating dynamic routes for project or product detail pages

• Setting up and managing a Global State using Context API

• Using React Hooks for advanced functionality in the app

• Integrating APIs to fetch dynamic data with Axios

Session 14. Building the Foundation with Node.js

• Learn how Node.js enables server-side development

• How npm helps manage dependencies for your project

• Build and run your first Node.js server

Session 15. Mastering the Event Loop

• Implement asynchronous programming to handle real-time tasks

Session 16. Middleware for Enhanced Functionality

• Use middleware to process incoming request bodies and handle form data

• Configure a view engine like EJS