Presentation is loading. Please wait.

Presentation is loading. Please wait.

Programming the Web Web = Computer Network + Hypertext.

Similar presentations


Presentation on theme: "Programming the Web Web = Computer Network + Hypertext."— Presentation transcript:

1 Programming the Web Web = Computer Network + Hypertext

2 Topics  Network  Hypertext  Languages for the web  HTML for content  Server-side programs  PHP  CGI programs  Client-side programs  JavaScript  What Next?

3 ARPANET  World's first packet-switching network  Funded by ARPA ( Advanced Research Projects Agency)  Initially connected computers at four universities in 1969  Eventually developed into the Internet  TCP/IP internetwork protocol developed to hide the differences between different networks

4 Hypertext  Printed documents are basically linear; linear access is not always the most convenient.  1945 Vannevar Bush described a device called Memex which would display articles and books allowing for automatic connections to cross references.

5 Computers made Hypertext Feasible  Ted Nelson coined the word Hypertext  Project Xanadu was started in 1967 to facilitate non-sequential writing.  Doug Engelbart wrote oNLine System, a computer collaboration program  Guide was a hypertext program for personal computers  Hypercard came with early Mac OS

6 Origins of the World-Wide-Web  Tim Berners-Lee proposed a hypertext program to facilitate sharing and updating information between scientists at CERN  Prototype system was called Enquire  CERN was one of the early major Internet nodes  Both local and wide-area connections  many different kinds of computers  WWW proposed in 1989

7 The Browsing Process  Web page stored on server  Client browser requests page

8 Generating Content  HTML for static content  Scripting languages for dynamic content  What features do languages need?  Platform independence  Security  Intellectual property  Where and how do you store the information needed by the programs?  Where does the program run?

9 HTML for Static Content  Two parts to the information that is being shared  Content - what does it say  Presentation - how does it look  HyperText Markup Language allows you to mark up the content  Browser implements the mark-up commands

10 HelloWorld in HTML PHP Hello, world! http://cs.boisestate.edu/~tcole/web/seminar/hello.html

11 Beyond HTML  Cascading Style Sheets separate form and content  can have multiple views of same content  XML provides extensibility  Document Object Model created to support scripting

12 Server-side Programs  Program running on server has access to all server data  Network traffic required for each interaction

13 Two Approaches  CGI (Common-Gateway-Interface) programs  can be written in any language  Web server starts program and sends/receives data  PHP  PHP code in a web page is sent to the PHP interpreter which returns text to be sent to the browser

14 Using PHP  PHP code goes into special elements in HTML files.  There can be multiple php elements in a page  The browser never sees the PHP code  File needs to have a.php or.phtml extension

15 Examples  PHP  Hello with form Hello with form  Index of a directory Index of a directory  Using a database with PHP Using a database with PHP  CGI  Hello as a perl CGI program Hello as a perl CGI program  Code for above program Code for above program

16 HelloWorld in PHP PHP http://cs.boisestate.edu/~tcole/web/seminar/hello.php

17 Client-side Scripts  Program runs on client  Must use language that client can run  Need to protect client from malicious actions

18 JavaScript  JavaScript code is embedded into html pages  in elements in both and elements of a page  in event attributes of appropriate elements  JavaScript code is interpreted by your browser  Program has access only to local data  The html document is an object whose data can be accessed by the program

19 HelloWorld in JavaScript JavaScript document.write ( "Hello, World!"); http://cs.boisestate.edu/~tcole/web/seminar/jshello.html

20 Examples  Image Rollover Image Rollover  Function calculator Function calculator  Form checking Form checking

21 Web of collaboration  personal information system  permanent, anywhere access  web removes distance as a factor in human interaction  location independence  protocol-independence  device-independence (scalable vector graphics)

22 Next dream for the web  Collaboration between machines  Semantic web  Search engines  SOA

23 Sources  Weaving the Web by Tim Berners-Lee  Wikipedia Wikipedia  Web programming Links Web programming Links


Download ppt "Programming the Web Web = Computer Network + Hypertext."

Similar presentations


Ads by Google