1: Introduction to Coding

• What is coding and why it’s important.
• Introduction to web development: Frontend vs. Backend.
• Exploring coding languages: HTML, CSS, JavaScript.
• Introduction to web development tools: Text Editors (e.g., VS Code), Browsers, and Developer Tools.
• Introduction to the coding environment in the app: Interactive code editor and preview pane.
• Activity: Create a simple "Hello, World!" HTML page.

2: HTML Basics - Structure of a Web Page

• Basic HTML tags (head, body, title, div, etc.).
• Structure of a web page: Elements, attributes, and tags.
• Using text formatting tags: headings, paragraphs, links, lists, images.
• Activity: Build a personal webpage with a heading, paragraph, and an image.

           3: Styling with CSS

• What is CSS?
• How to apply CSS to HTML (Inline, Internal, and External).
• CSS Syntax: Selectors, Properties, and Values.
• Styling text, colors, and backgrounds.
• Layouts: Working with boxes (padding, margin, border).
• Basic positioning (static, relative, absolute).
• Activity: Style the personal webpage created in Week 2, add colors, fonts, and layout adjustments.

4: Introduction to JavaScript - Making Websites Interactive

• Introduction to JavaScript and its role in web development.
• Syntax: Variables, data types, and operators.
• Writing simple JavaScript code.
• Functions and events.
• DOM manipulation: Changing content and styles dynamically.
• Activity: Add an interactive button to the personal webpage that changes the background color when clicked.

           5: Building Interactive Elements with JavaScript

• Event handling: Clicking buttons, hovering over elements, etc.
• User input: Prompting users for input (using prompt() and alert()).
• If statements and loops.
• Creating simple animations.
• Activity: Build a simple quiz game with JavaScript (asking questions and providing feedback).

6: Introduction to Responsive Design

• What is responsive design and why it's important.
• Media Queries: Making designs adapt to screen sizes.
• Flexbox: A powerful layout tool for building flexible web designs.
• Basic mobile-first design principles.
• Activity: Update the personal webpage to be mobile-friendly using media queries and Flexbox.

 7: Final Project - Build Your Own Website

• Planning a website: Layout, content, and design.
• Organizing HTML, CSS, and JavaScript files.
• Adding multimedia: Images, videos, audio.
• Final touches: Making it interactive and polished.
• Activity: Build a final project website, e.g., a portfolio or blog, integrating HTML, CSS, and JavaScript.

           8: Publishing and Sharing Your Website

• Introduction to web hosting.
• Uploading your website to platforms like GitHub Pages or Netlify.
• Sharing the website with friends and family.
• Understanding the basics of domain names and web addresses.
• Activity: Publish the final project on GitHub Pages or another hosting service and share the link.