Class 29: Vocational Skills How to Build a Dynamic Web Site David Evans
advertisement
Class 29: Vocational Skills
How to Build a Dynamic
Web Site
CS200: Computer Science
University of Virginia
Computer Science
David Evans
http://www.cs.virginia.edu/evans
Vocational Skills
Job listings at monster.com (31 March 2004):
SQL
PHP
HTML
Scheme
31 March 2004
“more than 5000”
$80-$400K
3570 posted in last 14 days
785
$40-$150K
“more than 5000”
203 in last 24 hours
0
$30-50K
$200K?
CS 200 Spring 2004
2
Today’s Aberrant Class
• Covers topics primarily selected for their
practical (not intellectual) value
• Covers material found in “For Dummies”
books (but we’ll cover it differently)
• There is no “Computability Theory for
Dummies”, “Complexity Theory for
Dummies”, “Higher Order Procedures for
Dummies”, “Recursive Definitions for
Dummies”, etc. book
31 March 2004
CS 200 Spring 2004
3
HyperText Transfer Protocol
Server
GET /cs200/index.html HTTP/1.0
<html>
<head>
…
Contents
of file
Client (Browser)
HTML – hypertext markup language
Way of describing hypertext documents
31 March 2004
CS 200 Spring 2004
4
HTML: HyperText Markup Language
• Language for controlling presentation of
web pages
• Uses formatting tags
– Enclosed between < and >
• Not a powerful language (we will learn
what this means more precisely next week)
– no way to make procedures or jump
31 March 2004
CS 200 Spring 2004
5
HTML Grammar Excerpt
Document ::= <html> Header Body </html>
Header ::= <head> HeadElements </head>
HeadElements ::= HeadElement HeadElements
HeadElements ::=
HeadElement ::= <title> Element </title>
Body ::= <body> Elements </body>
Elements ::= Element Elements
Elements ::=
Element ::= <p> Element </p>
Make Element a paragraph.
Element ::= <center> Element </center>
Center Element horizontally on the page.
Element ::= <b> Element </b>
Display Element in bold.
Element ::= Text
What is a HTML interpreter?
31 March 2004
CS 200 Spring 2004
6
Dynamic Web Sites
• Programs that run on the client’s machine
– Java, JavaScript, Flash, etc.: language must be
supported by the client’s browser (so they are usually
flaky and don’t work for most visitors)
– Used (almost exclusively) to make annoying animations
to make advertisements more noticeable
• Programs that run on the web server
– Can be written in any language, just need a way to
connect the web server to the program
– Program generates regular HTML – works for everyone
– (Almost) Every useful web site does this
31 March 2004
CS 200 Spring 2004
7
Dynamic Web Site
Server
GET /cs200/notes/presidents.php3
<html>
<head>
…
Client (Web Browser)
“HTML Interpreter”
31 March 2004
CS 200 Spring 2004
8
Dynamic Web Site
Client
GET /cs200/notes/presidents.php3
File Server
Read
~evans/public_html/cs200/notes/presidents.php3
Request
Processor
31 March 2004
<html>
<head><title>Presidents of the United
States</title></head>
<body>
<h1>Presidents of the United
States</h1>
<p>
<?
$hostName = "dbm1.itc.virginia.edu";
$userName = "dee2b";
$password = "quist";
CS 200 Spring 2004 $dbName = "dee2b_presidents";
9
…
Processing a GET Request
<html>
<head><title>Presidents of the United
States</title></head>
<body>
<h1>Presidents of the United
States</h1>
<p>
<?
$hostName = "dbm1.itc.virginia.edu";
$userName = "dee2b";
$password = "quist";
$dbName = "dee2b_presidents";
…
Regular HTML:
Send through to client
PHP Code: (inside <? … ?>)
Evaluate using PHP
evaluator, send result to
client
to
Client
PHP
Evaluator
31 March 2004
CS 200 Spring 2004
10
PHP Code
• A universal programming language
– Everything you can compute in Scheme you
can compute in PHP
– Everything you can compute in PHP, you can
compute in Scheme
– Friday we will explain why more convincingly
• Imperative Language
– Designed to support a style of programming
where most of the work is done using
assignment
31 March 2004
CS 200 Spring 2004
11
Learning New Languages
• Syntax: Where the {, ;, $, etc. all go
– If you can understand a BNF grammar, this is easy
• Semantics: What does it mean
– Learning the evaluation rules
– Harder, but most programming languages have very
similar evaluation rules
• Style
– What are the idioms and customs of experienced
programmers in that language?
• Takes many years to learn
• Need it to be a “professional” PHP programmer, but not to make
a useful program
31 March 2004
CS 200 Spring 2004
12
PHP If
Instruction ::= if (Expression) { Instructions }
Evaluate Expression. If it
evaluates to true, evaluate the
Instructions.
It is similar to (if Expression (begin Instructions))
Difference is what “true” means. In Scheme, it
means anything that is not #f. In PHP it means
anything that is not 0, the empty string, or a few
other things.
31 March 2004
CS 200 Spring 2004
13
PHP Example
Assignment: (define i 1) or (set! i 1)
$i = 1;
$a = 1; $i is a variable (all variables start with $)
$b = 1;
while ($i <= 10) {
print "Fibonacci $i = $b<br>";
$next = $a + $b;
$a = $b;
$b = $next;
$i = $i + 1;
};
Instruction ::= while (Expression) { Instructions }
31 March 2004
As long as Expression evaluates to true, keep
doing Instructions.
CS 200 Spring 2004
14
Using a Database
• HTTP is stateless
– No history of information from previous
requests
• To do something useful, we probably need
some state that changes as people visit
the site
• That’s what databases are for – store,
manipulate, and retrieve data
31 March 2004
CS 200 Spring 2004
15
<html>
<head><title>Presidents of the United
States</title></head>
<body>
<h1>Presidents of the United
States</h1>
<p>
<?
$hostName = "dbm1.itc.virginia.edu";
$userName = "dee2b";
$password = "quist";
$dbName = "dee2b_presidents";
…
Regular HTML:
Send through to client
PHP Code: (inside <? … ?>)
Evaluate using PHP
evaluator, send result to
client
to
Client
PHP
Evaluator
Values
SQL Command
Database
31 March 2004
CS 200 Spring 2004
16
SQL
• Structured Query Language (SQL)
– (Almost) all databases use it
• Database is tables of fields containing
values
• All fields have a type (and may have other
attributes like UNIQUE)
31 March 2004
CS 200 Spring 2004
17
Demo
http://www.cs.virginia.edu/csdb/
31 March 2004
CS 200 Spring 2004
18
SQL Commands
• Create a table
CREATE TABLE presidents (
primary key – used to uniquely
number INT PRIMARY KEY,
select and entry in the table
lastname VARCHAR(100),
firstname VARCHAR(100),
college VARCHAR(100),
all fields must have a type
startdate DATE,
int – integer
varchar(n) – string of up to n characters
enddate DATE
);
presidents
number lastname
31 March 2004
firstname college startdate enddate
CS 200 Spring 2004
19
SQL: Add Entry
INSERT INTO presidents (number, lastname,
firstname, college, startdate, enddate)
VALUES (3, 'Jefferson', 'Thomas',
'William and Mary', '1801-03-04',
'1809-03-03');
presidents
number lastname
3
31 March 2004
firstname college startdate enddate
Jefferson Thomas
William
and Mary
CS 200 Spring 2004
1801-03-04 1809-03-03
20
SQL: Select
SelectQuery ::= SELECT fields FROM table joinClause
[WHERE conditions]
[ORDER BY field [DESC]]
SELECT * FROM presidents;
SELECT lastname FROM presidents;
SELECT lastname, firstname FROM presidents
ORDER BY lastname;
SELECT lastname, firstname FROM presidents
WHERE college=‘William and Mary’
ORDER BY lastname;
31 March 2004
CS 200 Spring 2004
21
Nesting Selects
• SELECT evaluates to a table, so of
course, we can SELECT from that table
SELECT lastname, firstname FROM
(SELECT * FROM presidents
WHERE college=‘William and Mary’)
ORDER BY lastname;
31 March 2004
CS 200 Spring 2004
22
SQL in PHP in HTML
<html>
<head><title>Presidents of the United States</title></head>
<body>
<h1>Presidents of the United States</h1>
<p>
<?
$hostName = "dbm1.itc.virginia.edu";
$userName = "dee2b";
$password = "quist";
$dbName = "dee2b_presidents";
mysql_connect($hostName, $userName, $password)
or exit("Unable to connect to host $hostName");
mysql_select_db($dbName)
or exit("Database $dbName does not exist on $hostName");
$result = mysql_query("SELECT lastname, firstname FROM presidents
WHERE college='William and Mary' ORDER BY lastname");
31 March 2004
CS 200 Spring 2004
23
$numrows = mysql_num_rows($result);
$numcols = mysql_num_fields($result);
print "<table border=0 cellpadding=5>"; print "<tr>";
for ($k = 0; $k < $numcols; $k = $k + 1) {
print "<th>" . mysql_field_name ($result, $k) . "</th>";
}
print "</tr>";
for ($i = 0; $i < $numrows; $i++) { // $i++ is short for $i = $i + 1
for ($j = 0; $j < $numcols; $j++) {
print "<td>" . mysql_result ($result, $i, $j) . "</td>";
}
print "</tr>";
}
print "</table>";
mysql_close(); // Close the database connection
?>
<p><hr>
<a href="mailto:evans@cs.virginia.edu"><em>evans@cs.virginia.edu</em></a>
</body></html>
31 March 2004
CS 200 Spring 2004
24
The Resulting Page
31 March 2004
CS 200 Spring 2004
25
Charge
• Combining PHP, SQL and HTML is Very
Powerful
• Query can be a string generated by your
program!
– Based on user input and hyperlink clicks
• Code can be generated based on what is
in the database
31 March 2004
CS 200 Spring 2004
26
