Module 1: HTML Fundamentals
Lecture 1:
- Introduction to Web Development
- What is HTML and how the web works
- Structure of an HTML Document
- Common HTML Tags: headings, paragraphs, images, links
- Lists: ordered & unordered
- Tables and Forms (basics)
Lecture 2:
- Form Elements in Depth (input, select, textarea, button)
- Semantic HTML (section, article, header, footer)
- HTML Media: audio, video, iframe
- Best Practices for HTML
Module 2: CSS Basics
Lecture 3:
- What is CSS and how to apply it (inline, internal, external)
- Selectors, Classes, IDs
- Colors, Fonts, Text, Borders
Lecture 4:
- Box Model: margin, padding, border
- CSS Positioning: relative, absolute, fixed
- Display & Visibility
- Responsive units: %, rem, em, vh/vw
Module 3: Bootstrap 5
Lecture 5:
- What is Bootstrap and why use it
- Bootstrap Grid System (container, row, col)
- Typography, Buttons, Alerts, Badges
Lecture 6:
- Forms, Cards, Navbars, Carousel
- Utilities and Responsive Classes
- Building a simple responsive page with Bootstrap
Module 4: Basic React Frontend
Lecture 7:
- What is React and why use it
- Setting up React App using Vite or Create React App
- Folder structure & JSX Introduction
- Components & Props
Lecture 8:
- useState Hook (basic intro)
- Event Handling in React
- Mapping and rendering lists
- Simple React UI with Bootstrap
Module 5: WordPress Frontend
Lecture 9:
- What is WordPress and its importance
- Installing WordPress locally (XAMPP or LocalWP)
- WordPress Dashboard Tour
- Pages, Posts, Categories, and Media
Lecture 10:
- Themes and Customization
- Installing Page Builders (Elementor/Block Editor)
- Designing Home/About/Contact pages
Module 6: Final Project + Recap
Lecture 11:
- Create a complete simple static site using HTML + CSS + Bootstrap
- Start mini project using React or WordPress
Lecture 12:
- Complete and showcase final projects
- Tips for hosting (GitHub Pages, Netlify for React, or free WordPress hosting)
- Career Paths and Freelancing Tips
Tools & Technologies
- VS Code
- Live Server Extension
- Bootstrap CDN
- React (with Vite or CRA)
- LocalWP / XAMPP for WordPress
