1. ECT 270 Client-side Web Application Development Professor Robin Burke

2. 2 Outline Networking Internet Protocols Addressing Web Protocol History

3. 3 Late policy You can turn in homework up to 3 days late 10% per day Due time = class time do not skip class to work on homework!

4. 4 What is the Internet The Internet is an interconnected network of thousands of networks and computers. ( “inter-network”) Began in the 1960s as a Department of Defense project The World Wide Web is just one of the services that run on the Internet.

5. 5 What is a network? Computer system that links two or more computers - To share data, info, hardware, software Local Area Network (LAN) A collection of computers that share hardware, software and data over a small geographical area (home, office, school lab) Wide Area Network (WAN) It spans a wider area (offices, schools, cities, countries) Connects different LANs

6. 6 Networking

7. 7 Network layers

8. 8 Packet switching The Internet is an example of packet- switched network Each message traveling on the network is broken down into packets of bytes Each packet is transmitted individually from computer to computer over different paths. Routers decide the optimal path to get each packet to its destination

9. 9 Packet-switched Network

10. 10 Benefits of packet switching Load distribution data distributed over a wide number of possible paths to balance traffic. Error recovery inexpensive to replace damaged packets, instead of entire messages. Fault tolerance communication can continue even if a node goes down

11. 11 Protocols Because networks use a wide variety of hardware and software, protocols are needed to coordinate communication and data transmission. A protocol is a set of rules for the exchange of data across communication lines.

12. 12 Need for Protocol Client programs must know how to state requests Server must know how to interpret The protocol is the agreement Important A weak or inflexible protocol limits what can be done A complex protocol may be difficult to implement

13. 13 TCP/IP TCP (transmission control protocol) controls the break down of a message into packets before it is transmitted over the network. the reassembly of packets once they reach their destination The IP (Internet Protocol) includes rules for routing individual data packets from their source to their destination addressing details for each packet.

14. 14 Packets

15. 15 Addressing The IP protocol has to know where to send its packets “Routing” To route a packet we need its address “IP Address”

16. 16 IP Addresses A host on the Internet must have an IP address 32-bit number divided in four 8-bit numbers Written with a dot in between 14.192.1.100 Each number ranges from 0-255 Some addresses have a special interpretation 127.0.0.1

17. 17 IP Addresses, cont’d In general the farther to the right in the address the closer to a particular host 14.192.1.100 all of the machines with 14.192.1 addresses are probably in a LAN all of the machines with 14.192 addresses might be owned by the same organization

18. 18 Problem #1 can we run out? 2^32 addresses Answer yes Solution IPv6 = 128 bit addresses starting to be available now

19. 19 Problem #2 How to keep track of lots of 32-bit numbers Would you rather type 207.171.183.16 or amazon.com Solution domain naming system

20. 20 Domain Name Server A Domain Name Server (DNS) is responsible for the mapping between domain names and IP addresses. bach.cs.depaul.edu Org. type (top level domain) Organization name Host name IP address: 140.192.32.50.com.org.gov.mil.net.it.museum.biz

21. 21 DNS One of the few centralized services in a distributed Internet Everybody must agree on what name matches what number Site creator must go through a domain registration process claim a name associate it with an address

22. 22 Client/server interaction A lot of Internet applications work under the client/server model Server knows something, or can do something Client wants to know something, or wants to do something

23. 23 Client/server cont’d Client sends request Server sends response Example: Email A central computer stores and forwards electronic mail Client computers contact the server to get email for a particular user

24. 24 Protocols for client/server internet applications Simple Mail Transfer Protocol (SMTP): transferring email messages from one machine to another File Transfer Protocol (FTP): transferring files between local and remote machines. Telnet: a terminal emulation protocol used to login in remotely. Telnet now superceded by ssh increased security

25. 25 HyperText Transfer Protocol HTTP is the protocol responsible for transferring and displaying web pages. HTTP uses the client/server model of computing. The client is the user’s web browser (I.E, Netscape) The server is the web server where the page resides. (www.nyt.com)

26. 26 Client/Server Web Interaction

27. 27 HTTP Protocol Request “I want something” Response “Here it is” or “Not found” Headers Body

28. A Typical HTTP Exchange Client: Please open a connection to ‘www.nytimes.com’ and send me the default file. I am located at IP Address 140.192.1.6. Netscape’s URL Window NY Times Web Server Server: Let me check…. Okay, the default file at this site is of type HTML. It is 1749 bytes in size. The date is 3/28/2004 at 23:42:33. NY Times Web Page

29. 29 HTTP Response Example

30. 30 Uniform resource locator The Web uses a naming convention called the uniform resource locator (URL). A URL consists of at least two and as many as four parts. A simple two part URL contains the protocol used to access the resource followed by the location of the resource. Example: http://www.cs.depaul.edu/http://www.cs.depaul.edu/ A more complex URL may have a file name and a path where the file can be found.

31. 31 http://josquin.cs.depaul.edu/~rburke/courses/s04/index.html domain The protocol used path that identifies location of document uniquely document name A Web URL deconstructed The user is a directory in the system

32. 32 Note Path may not correspond to files/folders The web server is free to interpret the path however it likes 80% of the time the path indicates a location in a file system where a file is stored

33. 33 FTP URL ftp://rburke4@condor.depaul.edu/ Access my files on condor using File Transfer Protocol Email URL mailto:rburke@cs.depaul.edurburke@cs.depaul.edu mailto scheme for electronic mail addresses Newsgroup URL news:dpu.general news scheme for USENET news groups and articles Other URLs

34. 34 Prehistory of the Web In the 1960s Douglas Englebart, created the first experimental hypertext system: Augment 1984: Apple releases the HyperCard program as part of its graphical user interface operating system Macintosh. Introducing hypertext as a widely- available commercial product.

35. 35 Hypertext Documents Hypertext refers to a document that its connected with other documents in many ways Hypertext systems have been around for a long time 1960s Why was the web an innovation? keep this question in mind

36. 36 CERN and hypertext In 1990 CERN, a lab for particle Physics in Geneva, had been connected to the Internet for 2 years. Scientists were looking for better ways to circulate their scientific papers and data. Tim Berners-Lee proposed an hypertext development project.

37. 37 The birth of the Web In the next two years Berners-Lee developed the code for an hypertext server program and made it available on the Internet. He envisioned the set of links to and from computers worldwide as a spider web, hence the name World Wide Web. The CERN is considered the birth place of the WWW.

38. 38 What did Berners-Lee invent? HTTP The protocol for distributing web pages HTML The language for describing web pages

39. 39 HTML Documents Most web pages are HTML documents HTML HyperText Markup Language A language for describing the contents of a hypertext page

40. 40 Web browser history A web browser is a user interface that allows users to read (browse) HTML documents. It acts as a web client. The first browsers were text based. In 1993 Andreessen developed the first browser with a graphical user interface, named Mosaic. In 1994 Andreessen developed Netscape In 1995 Microsoft released free Internet Explorer starting the “Browser Wars”. In 1998, Netscape was clearly losing. Launched mozilla.org Made a browser based on Netscape code open-source

41. 41 Web Page with Interesting Fonts, Graphics, and Layout This figure shows a Web page is not only a source of information, it can also be a work of art. links graphic image The Web designer has a great deal of control over the format of the page. interesting fonts

42. 42 Terminology Web browser a client program that can render (display) web pages and other media wide variety: text, graphical, cell phone, etc. Web server a server program that responds to web requests and delivers web pages and other media Proxy / gateway / cache / firewall / load balancer Special programs or devices that are "middlemen" in the communication between browser and server Improve efficiency, security, etc.

43. 43 More terminology web page an HTML document that can be viewed in a web browser hyperlink a special notation in an HTML document that points to an Internet resource

44. 44 More terminology client-side processing that takes place within or associated with the web client, or browser server-side processing that takes place within or associated with the web server web application any software application whose mode of delivery is the WWW

45. 45 The name of this class Client-side Web Application Development We will be developing web applications that make use of the browser

46. 46 Why the Web? The protocols that made linking possible were open The concept of linking extended to an open-ended set of Internet protocols The concept of inclusion of images by a mechanism similar to linking The use of one-way links with minimal bookkeeping requirements

47. 47 Open protocols The web protocol (HTTP) is open Meaning anyone can write a web server anyone can write a web browser anyone can author web pages there is a well-defined public mechanism for revising and extending the standard Not true of earlier hypertext technologies

48. 48 Monday Begin HTML Chapters 2 and 3 Homework due before class