[Go to site: main page, start]
Scribd
Upload
21 views2 pages

JavaScript Basics for Web Development

This document provides an introduction to JavaScript, covering its core concepts, syntax, and basic functionalities such as variables, arrays, objects, and functions. It also includes a brief overview of HTML and CSS, highlighting their roles in web development and providing examples. Additionally, it suggests resources for further learning and practice activities for hands-on experience.

Uploaded by

Joshua Huang
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
21 views2 pages

JavaScript Basics for Web Development

This document provides an introduction to JavaScript, covering its core concepts, syntax, and basic functionalities such as variables, arrays, objects, and functions. It also includes a brief overview of HTML and CSS, highlighting their roles in web development and providing examples. Additionally, it suggests resources for further learning and practice activities for hands-on experience.

Uploaded by

Joshua Huang
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

Introduction to JavaScript

Overview: JavaScript is a versatile programming language used primarily for


web development. This guide introduces its core concepts.

Why JavaScript?
• Adds interactivity to websites.
• Runs in browsers and on servers (via [Link]).
• Large ecosystem with frameworks like React and Vue.

Basic Syntax javascript


// Variables
let greeting = "Hello, World!";
const PI = 3.14;

// Arrays
let colors = ["red", "blue", "green"];
[Link]("yellow");
[Link](colors); // Output: ["red", "blue", "green", "yellow"]

// Objects
let person = { name: "John", age: 25 };
[Link]([Link]); // Output: John

Functions javascript
function add(a, b) {
return a + b;
}
[Link](add(2, 3)); // Output: 5

// Arrow function
const multiply = (a, b) => a * b;
[Link](multiply(4, 5)); // Output: 20

DOM Manipulation javascript


[Link]("myElement").innerHTML = "Changed!";

Resources
• MDN Web Docs
• [Link]

1
2. HTML & CSS Basics
Overview: Learn the building blocks of web development with HTML (structure)
and CSS (styling).

HTML Example html


<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Welcome</h1>
<p>This is a paragraph.</p>
</body>
</html>

CSS Example css


body {
background-color: #f0f0f0;
}
h1 {
color: navy;
text-align: center;
}
p {
font-size: 16px;
}

Key Concepts
• HTML: Use tags like <div>, <a>, <img> for structure.
• CSS: Style with selectors, properties (e.g., color, margin).
• Box Model: Every element has padding, border, and margin.

Practice
• Create a personal portfolio page.
• Use CodePen to experiment.

You might also like