Computers talking to each other.
(more computers)
Basically, a collection of text files in a folder on a computer somewhere.
2 main pieces involved in accessing a website
Your browser uses the internet to ask Facebook's server for the website
Facebook's server sends the files back to your browser
Your browser reads the files, and interprets the code inside them to display the website (as Facebook intended for it to look) on your screen.
<example> Some text on my webpage </example>
<p>Welcome to my site!</p>
Missing end tag :(
All tags are pre-defined
i.e. you'll need to learn what they are.
<div> <span>Hi there!</span> <span>more text</span> </div>
<!DOCTYPE html>
<html>
<head> </head>
<body> </body>
</html>
<!DOCTYPE html>
<html>
<head>
<title> Dan's Website </title>
</head>
<body>
<h1> Hello world, here's a website </h1>
<p> by Dan </p>
</body>
</html>
Block elements begin on a new line and flow down the page
Inline elements flow exactly like text does.
<h1>Hello!</h1> +
h1 { color: red; }
=
or
selector { property:value; property:value; }
selector{ property: value; property: value; }
p {
color: red;
font-size: 14px;
}
#photo-gallery { width: 500px; height: 400px; }
Tomorrow!
Don't worry, we'll take things easy.
Variable names must start with a letter or an underscore.
var firstName, lastName, age;
firstName = "Joe";
lastName = "Bean";
age = 27;
var firstName ="Joe"; var lastName = "Bean"; var age = 27;
var firstName = "Joe"; firstName = "Dan";
var firstName = "Joe"; var strAge = "27";
var intAge = 27;
var yearOfBirth = 1985;
What's the difference between strAge and intAge? Type.
integers (only numbers)
"27"+"16"; → "2716" 27 + 16; → 43
"hello" + "world"; → "helloworld"
A function defines a block of code
that can be reused.
What if we wanted to do the same thing many times in our code?
function sayMyName(){
alert("Dan");
}
sayMyName();
Declare the function
Call it
function addNumbers(){ var num1 = 1; var num2 = 2; var num3 = num1 + num2; alert(num3); }
<script type="text/javascript"> alert("hello world!"); </script>
$('#photo-gallery').show();
$('#photo-gallery').hide();