Scribd
Upload
12 views5 pages

Web Development Beginner Notes Lessons 1 To 5

The document provides an introduction to web development, covering key concepts such as frontend and backend development, HTML, CSS, and JavaScript basics. It outlines essential tools and techniques for building web pages, including the structure of HTML, styling with CSS, and adding interactivity with JavaScript. The final lesson guides users through creating their first web page by combining these technologies.

Uploaded by

justintrump702
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
12 views5 pages

Web Development Beginner Notes Lessons 1 To 5

The document provides an introduction to web development, covering key concepts such as frontend and backend development, HTML, CSS, and JavaScript basics. It outlines essential tools and techniques for building web pages, including the structure of HTML, styling with CSS, and adding interactivity with JavaScript. The final lesson guides users through creating their first web page by combining these technologies.

Uploaded by

justintrump702
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

Lesson 1 - Introduction to Web Development

Lesson 1: Introduction to Web Development

- Web Development is the process of building websites and web applications.

- It includes Frontend (client-side) and Backend (server-side) development.

- Frontend: What users see (HTML, CSS, JavaScript).

- Backend: Server logic, databases (Node.js, PHP, Python, etc.).

- Tools:

- Browser (Chrome, Firefox)

- Text Editor (VS Code, Sublime)

- DevTools (Inspect Element, Console)


Lesson 2 - HTML Basics

Lesson 2: HTML Basics

- HTML stands for HyperText Markup Language.

- It structures content on the web.

- Basic Tags:

- <!DOCTYPE html>

- <html>, <head>, <title>, <body>

- <h1> to <h6>, <p>, <a>, <img>, <ul>, <ol>, <li>

- Attributes: href, src, alt, title

- Nesting elements properly is important.


Lesson 3 - CSS Basics

Lesson 3: CSS Basics

- CSS stands for Cascading Style Sheets.

- Used for styling HTML elements.

- Types:

- Inline: <p style="color:red;">

- Internal: <style> in <head>

- External: Linked .css file

- Common Properties:

- color, background-color, font-size

- margin, padding, border

- CSS Selectors: element, .class, #id


Lesson 4 - JavaScript Basics

Lesson 4: JavaScript Basics

- JavaScript makes web pages interactive.

- Basic Syntax:

- console.log("Hello World");

- let, const, var for variables

- Data Types: string, number, boolean, array, object

- Operators: +, -, *, /, ==, ===, &&, ||

- Functions and events (like onclick)


Lesson 5 - Creating Your First Web Page

Lesson 5: Creating Your First Web Page

- Combine HTML, CSS, and JavaScript.

- Simple Page Example:

- HTML: Structure

- CSS: Styling

- JavaScript: Interactivity

- Project:

- Create an index.html

- Add style.css and script.js

- Link CSS and JS in HTML file

- Use a browser to open your web page and test.

You might also like