web architecture

Post on 27-Nov-2014

4.387 Views

Category:

Technology

0 Downloads

Preview:

Click to see full reader

DESCRIPTION

 

TRANSCRIPT

CGS 2835 Interdisciplinary Web Development

Web ArchitectureWeb Architecture

mysite

index.html

me.jpgprofile.html

seal.gif

index.html<html><head><title>My Page</title><link href="style.css" rel="stylesheet" type="text/css" /></head><body>

</body></html>

<a href=“profile.html”>My Profile</a>

<img src=“seal.gif” />

style.css

Web sites are developed on PC with files stored in one common folder.

WEB SERVER

iSpace.ci.fsu.edu

username

personalhtml

mysiteSFTP

Web sites are transferred to a Web server maintaining the relative locations of connected files.

Location in html

URL:

Domain/ServerYour htmlfolder

http://ispace.ci.fsu.edu/~username/mysite/index.html

WebClient

WEB SERVER

iSpace.ci.fsu.edu

username

personalhtml

HTML REQUESTHTML REQUEST

mysite

Web pages are requested by users using a URL or link.

Case matters.

index.html or index.phpAre the pages a web server will serve by default for a folder e.g.http://ispace.ci.fsu.edu/~username/mysite/

index.html

seal.gif

style.css

WEB SERVER

iSpace.ci.fsu.edu

username

personalhtml

HTML RESPONSEHTML RESPONSE

HTML page and referenced files are delivered to client PC where they are cached.

Client/Server Communication

Client/Server Communication

WEB SERVERWEB CLIENT

index.html

<html><head><title></title><script type="text/javascript"><!--var value1 = 45;var value2 = 60;var sum = value1 + value2;var str = value1;document.write(str);//--></script></head><body>

</body></html>

Javascript code may be embedded in HTML, interpreted and run by the client.

WEB SERVERWEB CLIENT

index.html

<html><head><title></title></head><body><form name="rez" method="post" action=“process.php”>

<input type="submit" name="Submit" value="Continue"></form></body></html>

Client/Server Communication

Client/Server Communication

HTML Forms may be used to collect user data and send it to the server for processing.

WEB SERVERWEB CLIENT

http://iSpace.ci.fsu.edu/username/mysite/process.php?name=geo

HTML REQUEST w/DATAHTML REQUEST w/DATA

Data sent to the server for processing can be put in the URL

This allows people to share links with the same data being sent to the server

WEB SERVERWEB CLIENT

HTML REQUEST w/DATAHTML REQUEST w/DATA

PHP code (or other programming language) runs on server, manipulating input and creating HTML output.

PHP

WEB SERVERWEB CLIENT

HTML REQUEST w/DATAHTML REQUEST w/DATA

PHP code is embedded in html code and stored in a .php file.

PHP

Can embedded PHP code run on the client?

WEB SERVERWEB CLIENT

HTML REQUEST w/DATAHTML REQUEST w/DATA

Other programming languages (PL’s) like Perl, Java, C++, store code in a separate file on the server and access it using CGI.

PHP

WEB SERVERWEB CLIENT

HTML REQUEST w/DATAHTML REQUEST w/DATA

Programs may access data in a databaseusing a database manipulation language (DBML) like MySQL.

PHP + MySQL

DBDB

WEB SERVERWEB CLIENT

A Web page is created “on the fly” as output from server side software.

PHP + MySQL

DBDBProgram Output as HTMLProgram Output as HTML

Client/Server Communication

Client/Server Communication

(X)HTMLFORMSIMG: JPG/GIF/PNGCSSJAVASCRIPTJAVA

PHP & OTHER PL’SMYSQL & OTHER DBML’S

DBDB

WEB SERVERWEB CLIENT

REVIEW

top related