homework / exam
DESCRIPTION
Homework / Exam. Exam 3 Solutions Posted Questions? HW8 due next class Final Exam See posted schedule Websites on UNIX systems Course Evaluations. Final Exam. Final Exam See posted day, time, and location It will be 1-1/2 hours – not 3 hours - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/1.jpg)
1
Homework / Exam
• Exam 3– Solutions Posted– Questions?
• HW8 due next class• Final Exam
– See posted schedule
• Websites on UNIX systems• Course Evaluations
![Page 2: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/2.jpg)
2
Final Exam• Final Exam
– See posted day, time, and location– It will be 1-1/2 hours – not 3 hours
• Watch your email for any late breaking announcements!
• Review HW7 and HW8• See the posted practice final exam• Review Session Next Class
![Page 3: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/3.jpg)
3
Websites on UNIX Systems
• Many websites are hosted on UNIX Systems
• My website is supported on our www server in the same way that I will be teaching now
• Learn a few basic rules and HTML coding and you can have your own website!
• Warning: For your educational or personal use only – No commercial websites allowed!
![Page 4: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/4.jpg)
4
The Big Picture
UNIX System
ApacheServer
Software
BrowserSoftware
PC/MAC
TheInternet
TCP/IPSoftware
TCP/IPSoftware
FileSystem
HTMLFiles
HTTPProtocol
![Page 5: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/5.jpg)
5
Browser
• Browser interacts with user to get URL
• Browser converts URL to an IP address
• Opens a connection to IP address and port 80
• Sends an HTTP “request” containing URL
• Receives HTTP “response” containing HTML
• Interprets and displays the HTML
![Page 6: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/6.jpg)
6
Web Server
• Apache server on UNIX system (Typical)– Interacts with browser clients via HTTP– Accesses HTML files on UNIX file system– Standard mapping from URL to path/file name
• http://www.cs.umb.edu/~bobw maps to
• ~bobw/public_html/index.html
– This home page can have links to other pages
![Page 7: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/7.jpg)
7
HTTP Protocol
• Application Layer Protocol– Requests– Responses
• Sent using TCP connections over IPTCP = Transport Control Protocol
IP = Internet Protocol
![Page 8: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/8.jpg)
8
To set up your website
• Use mkdir to create a sub-directory on your home directory named:public_html
• Edit and save a text file containing HTML document (program) in that directory as:index.html
• Use chmod to allow “others” read access• Remember UNIX is case sensitive!
![Page 9: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/9.jpg)
9
Basic HTML Document
<html>
<head>
<title>Display Title</title>
</head>
<body>
Contents of body defines what the browser displays
</body>
</html>
![Page 10: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/10.jpg)
10
Hello World HMTL File~yourname/public_html/index.html
<html>
<head>
<title>Your Name’s Hello World Website</title>
</head>
<body>
<p>Hello world!</p>
</body>
</html>
![Page 11: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/11.jpg)
11
Proper Nesting of <tag> and </tag>
<html>
<head>
<title> … </title>
</head>
<body>
<p> … </p>
</body>
</html>
Start/End onone line is OK
Start/End onone line is OK
![Page 12: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/12.jpg)
12
Basic HTML Tags
• Various font/format control pairsHeadings Level 1 <h1> </h1>Paragraph <p> </p>Bold <b> </b>Italics <i> </i>Center Text <center> </center>
• Some format control tags are not a tag pair:Break (new line) <br>
![Page 13: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/13.jpg)
13
Basic HTML Tags• Unordered Lists (Bullets at start of each line)
<ul> <li>List Item</li> <li>List Item</li></ul>
• Ordered Lists (Numbers at start of each line)<ol>
<li>List Item 1</li><li>List Item 2</li>
</ol>
![Page 14: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/14.jpg)
14
Links to Other Files
• Display a hyper-link to another html file:<a href=“filename.html"> Display Text</a>
• Display a link to download a non-html file:<a href=“filename.doc”> Display Text</a>
• Display an image from a non-html file:<img src="bob.jpg"> (Note: not a tag pair)
![Page 15: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/15.jpg)
15
HTML Forms and/or Get Requests• Forms defined using tags <form> </form>• Many useful form “widgets”:
– Text (Free Format Text Entry)– Check Boxes/Radio Boxes (on or off)– Select (Multiple Choice)
• Browser submits data to server programs:GET or POST methods
• Simple “GET” = URL followed by ?request:e.g.: url?parameter1=value1¶meter2=value2
![Page 16: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/16.jpg)
16
HTML Forms and/or Get Requests• Webpage reflect.html sends either:
– A POST request via submitting the form or– A GET request via the encoded URL
• Reflect.html form using “post” method:<form name = "reflect" method="post“ action=
"http://cgi1.cs.umb.edu/~bobw/cgi-bin/reflect.cgi”>
• Reflect.html encoded “get” URL:<a href="http://cgi1.cs.umb.edu/~bobw/cgi-bin/
reflect.cgi?Name=John+Jones&Phone=555-1234">
Get Request to reflect.cgi Program</a>
• URL is: http://www.cs.umb.edu/~bobw/reflect.html
![Page 17: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/17.jpg)
17
Dynamic Web Pages
• The URL points to an “executable program” file instead of to a “static” HTML document file
• The program generates response based on input request parameters and data stored on the server
• It writes response in HTML format to stdout
• These programs can be scripts PERL, PHP, etc. or Java servlets (e.g. generated from .jsp files)
• They can also be compiled C programs!
![Page 18: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/18.jpg)
18
CGI C Programs
• Compile your C program with executable file name suffix .cgi (e.g. makefile definition)reflect.cgi: reflect.c makefile
gcc -o reflect.cgi reflect.c
• Save executable file in a sub-directory in your public_html directory (e.g. “cgi-bin”)
![Page 19: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/19.jpg)
19
CGI C Programs• Environment variable REQUEST_METHOD
contains indicator of type of input (Get/Post)
• reflect.cgi figures out request method used:char *rm = getenv(“REQUEST_METHOD”);
• For a “Get” request, reflect.cgi uses:char *s = getenv(“QUERY_STRING”);
• For a “Post” request, reflect.cgi uses:int len = atoi(getenv("CONTENT_LENGTH"));
/* and reads len characters via getchar */
![Page 20: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/20.jpg)
20
CGI C Programs
• reflect.cgi just responds to browser with standard html “boilerplate” and a copy of the input data in the body without parsing it:arguments = 1, /home/bobw/public_html/cgi-bin/reflect.cgi
cgiRequestMethod = GET
QUERY_STRING: Name=John+Jones&Phone=555-1234
• A production cgi program would parse this input data, process it, and provide a response in html to the browser
![Page 21: Homework / Exam](https://reader036.vdocuments.us/reader036/viewer/2022070416/56815161550346895dbf8691/html5/thumbnails/21.jpg)
21
Course Evaluations
• Please fill out the course evaluation forms
• Give to assigned student for turn-in
• Thank you