Lecture 6 Data Driven Design

SFDV2001 – Web Development

Lecture 6: Data Driven Design

Server What is a server

− A machine that “serves“ files How to get a file

− you connect to the computer− send it a message saying what file you want− it sends that file to your machine

Must have− A program that listens for requests and sends files

when asked. This is what makes it a server.− Two main ones Apache (67%), MS IIS (21%)

11/09/07 (SFDV2001:24)Data Driven Design

Client Definition

− A machine that makes requests of a server and then displays the results.

Program that are web clients are− IE, Mozilla, Netscape, Safari

You request a file− a get message is sent and the page is returned− Special case http://www.otago.ac.nz is interpreted

as www.otago.ac.nz/index.html



Download cycle

Problem− not customized to the individual, − manual updating of information− no memory of previous visits

Client Server

get index.html

<html><head><title>Index</title><body> This is a test page</body></head>

Dynamic content We can have changing content Latest news stories Games Latest product information

Two type− Server-side− Client-side



Server-side

Types− ASP, PHP, CGI, SSI− you will see <name>.php e.g.

cosc360.otago.ac.nz/index.php Cycle

− client request− server processes request and gathers

information− returns contructed page that is HTML− client displays recieved page


Server-side

Advantages− Up-to-date information− easier to maintain and update− client machines just see HTML− removes redundant information storage

Disadvantages− Server has to do more work− opens up security issues− people may not be able to get the same page

later


Client-side

Types− Javascript, Java, imagemaps− content sent to your machine and it calculates

what to do. Advantages

− Users machines does work instead of server Disadvantages

− Sending more data− everybody can see how your site works− Dependent on the client browser support

11/09/07 (SFDV2001:24)Data Driven Design 9

Data driven design Static html and CSS is not good enough.

− We have lots of data and the web should be just one way of viewing that data.

Need to be − Dynamic− User centred− Accessing single data source− Maintainable− Current

There must be a better way!


LAMP

Linux, Apache, MySQL, PHP/Perl/Python− Linux Operating system− Apache Web server− MySQL Database− PHP Programming language

These create a free dynamic content web server

Underlying concepts similar between all database programs

Dynamic content the key


Database Database

− One or more Data file. Data file

− File containing rows of data. Principles

− Information should occur only once in an organisation

Postal address – Library, department, registry, OUSA, clubs and socs, careers advisory service, ...

− Accessing information should be fast Fast ways to search 30,000 records.


Example Database

Student records database.− StudentID, Fname, Sname, DOB, Addr− StudentID, PaperCode, Fees, Mark− PaperCode, Name, Desc, Year, Department

StudentID Fname Sname DOB933333 Simon Smith 18/12/807456324 Jane Jones 10/01/838756432 Ann Archer 31/03/84

.

.

.

.

.

StudentIDPaperCode Fees933333 COMP112_S1_04 Enrld933333 ENGL127_S2_04 Unproc7456324 COMP102_S1_04 Enrld8756432 COMP102_S1_04 Enrld8756432 COMP112_S1_04 Enrld8756432 ENGL127_S2_04 Unpro

.

.

.

PaperCode Name YearCOMP102_S1_04 Infoma.. 2004COMP112_S1_04 Comput.. 2004ENGL127_S2_04 Comput.. 2004

.

.

.

.

.

EnrollStudent Papers


Example Database Your name and address is stored in one place.

− You are referred to by your StudentID everywhere else.

− Your enrolment in your course is a row in a datafile. 9334567 COMP112_S2_2005 Enrolled ???

The University has a massive database with many links

− Lecturers, courses, labs, lecture theatres, examinations, departments, divisions

− Alumnia Database− National Student Number, graduates surveys


Query To extract information you query the database. Query:

− I want a list of the names of people enrolled in the course.

Process: − Find all the people enrolled in the course and then

match their ID numbers to the IDs in the Student file. Extract all the names for students with matching IDs.

− MYSQL: SELECT s.name FROM enrollments e, student s

WHERE e.papercode LIKE 'COMP112_S2_2005%' AND s.id = e.StudentID;


Views of Data Businesses store information in databases Views of data

− Managers like to look at reports.− Sales staff want to know what is in stock and the

current price.− Clients want to know about products and

descriptions.− Accountants want stock and sale information.− etc.......

These are all accessing the same data− Wouldn't it be nice to have the web site accessing

the same information.


Customisation Case study – Blackboard & PIMS.

− Login to personal information.− Access information about courses.− Discussion boards with updatable content.

Need more than just HTML to do all that. Server needs to extract information from a

database Present it in an acceptable form.


Discussion Board Many people accessing and adding content. Need to have web based access so users can

− Add content.− View new messages.− Select a thread.− Reply to messages.

Has to be dynamic, rather than static.− Weblog – blogs also need these properties.− Wiki – lots of visitor content alteration.


MySQL MySQL

− Free implementation of SQL (Structured Query Language).

− Database management software.− Allows full database control and programming.

Very common in conjunction with PhP as they are both free and run on Linux and play nicely with Apache.

Relational Database Complex once you are designing them for

optimal use


ASP, PHP & JSP Active Server Page. (MS)a• PHP Hypertext Preprocessor. (IBM)r• JavaServer Pages (Sun)a These systems allow

− Dynamic content.− Full programming language support.− Access to database information

MSaccess. MySQL. Oracle etc.

Easier to maintain as many tasks are automated.


Dynamic Navigation You can use PHP or ASP to add content. Using the GET part of the URL.

www.games.ac.nz/index.php?show=research will include the file in directory “inc/” called

“research.php”

<div id="bodybox"><?

$content = "inc/intro.php"; if (isset($_GET["show"])) {

$content = "inc/".$_GET["show"].".php"; } include($content); $modTime = filemtime($content);

?></div>

content = “inc/research.php”

content = “inc/intro.php”


Interactive Content Using a database and ASP or PHP

− User is a row in the database− Id stored in a cookie or with login− Messages, comments, interests,....− Trademe, Database and interactivity

User added content− Wiki's, blogs, forums, YouTube, MySpace,....− Cannot have just static content anymore.

All of these have some form of data driven content.


AJAX and Ruby Asynchronous Javascript and XML.

− Just a term for a way of doing stuff.− Interactive components in web pages.− Makes a webpage appear more like an application.− Google mail and Google Earth.

.Net and Ruby on Rails − Same basic concept.− Set up all the common tasks so they are created

with a single button press or line of code.− “on Rails” is a framework for developing rapid

prototypes of websites.− Data driven sites are easy to make with these tools.


Server Side Processing There is a lot to learn about programming. Good programmers can develop for any of

these web technologies. The more processing you do the more complex

the problems.

Eventually you need to be running the server so that you have access to everything

Lecture 6 Data Driven Design

Education

Transcript of Lecture 6 Data Driven Design