Welcome to the Internet
Why Do We Learn
![history.gif](servers/history.gif)
Why Do We Learn History?
To understand why things are the way they are.
Do Computers Talk Directly?
Computers do “talk” to each other:
![servers-3.png](servers/servers-3.png)
But they don’t connect directly.
Once upon a time…
Each computer was an island
- Hand friend a “floppy disk”
- Type code printed in a magazine
![handing-floppies.jpg](servers/handing-floppies.jpg)
Modem Connection
Computer would “call” another computer
- Very slow
- Had to know the computer’s number
- Computer had to be on
![servers-2.png](servers/servers-2.png)
Web Invented in 1993
![tim-berners-lee.jpg](servers/tim-berners-lee.jpg)
Start talking about a human right to connect. –Tim Berners-Lee
Two “Types” of Computers
Either:
![servers-4.png](servers/servers-4.png)
Client is
![clients.jpg](servers/clients.jpg)
Servers live in Data Centers
![datacenter.jpg](servers/datacenter.jpg)
Difference:
- We use a client to send or receive data
- To and from a server
![servers-4.png](servers/servers-4.png)
How do we “Get” Data?
Since we don’t know where the server is, we call it a cloud.
But if we don’t know where the server is, how do we talk to it?
Internet Address: URL
http://www.howard.com/pers/resume.html
Like an address to your house…
Address “Parts”
http://www.howard.com/pers/resume.html
Every “address” has five parts:
Protocol | → http or https |
Computer | → www |
Domain | → howard.com |
Folder | → pers |
File name | → resume.html |
Internet Communication
For something like Snapchat:
- First photo is uploaded to server
- Server stores photo
- Client asks for any files
- Server gives it the photo
![servers-5.png](servers/servers-5.png)
Internet is a Cloud
![servers-6.png](servers/servers-6.png)
What is a Web Page?
Each web page has parts:
- Word organization (
HTML
) - Word appearance (
CSS
) - Interaction and Changes (
JavaScript
) - Images, movies (media)
Huh?
![html-skeleton.jpg](servers/html-skeleton.jpg)
HTML
<body> <h1>My Essay</h1> <p> This is the start of some words... </p> <img src="http://www.google.com/img/bananas.jpg" /> </body>
CSS
p { font-size: 24px; color: green; text-emphasis: italics; }
JavaScript
- Computer Language
- Runs in the Browser
- jQuery connects JavaScript to the parts of your HTML