3 Tier Web Development

1. 3 Tier Web Development Bryan Duggan

2. Three important decisions • Organisation • Navigation • Choice of technology

3. Organisation • How files are organised on the server • By file type • Separate folders for html, js, images • By content • Separate folders for sales, marketing, college

4. Navigation • Frames ? • Site map • Search on each page • Drop down lists • Search • Long pages (links back to the top) • Back functionality

5. Choice of technology • Client • HTML/XHTML • CSS • Flash • Javascript • Java • CSS • Voice • Middle tier • PHP • ASP • JSP • Cold fusion • Server • MySQL • SQL Server • Oracle

6. Revision

7. Question… • Place the following terms in the 3-tier architecture: • JavaScript, SSI, J2EE, MySQL, Oracle, CSS, PHP, ASP.NET, Flash, Java Applets, JSP, Dreamweaver, Microsoft .NET

8. HTTP Protocol RFC’s: 1945 2068 2616 Parameters Request Web Browser Response Query E.g. A user fills in a form, which gets submitted to a web server Port Numbers (16 bit numbers) identify the service Results Web Server Database (Optional) http://www.ietf.org/rfc/rfc1945.txt?number=1945

9. Displaying a Web page in a Browser • <a href= http://www.cems.uwe.ac.uk/~cjwallac/UFIE8V-2004/l2_3tier.html>Lecture 2</a> • URL is decoded : protocol/host/file • Page requested from host • Page is returned • HTML codes determine how text is rendered • If page contains links e.g. <img src=red.gif>, browser must repeat the same process on each

10. Dynamic Web page needed when: • Consistent look and feel on each page of a large site • Data is derived from a database • Depends on real time • Pages depend on user choice • Business transactions e.g. e-commerce…

11. Presentation tier • Issue request to remote server • accept the returned HTML (or JPEG..) file • render (i.e. create a 2-d image ) the HTML • allow plug-ins to handle new file types • execute client-side scripts in JavaScript • support interaction between client-side scripts and the web page • accept user input via a variety of controls on a form

12. Persistence tier • interaction with the database using standard languages e.g SQL queries and table returns • define and modify the data structures (e.g. tables) themselves ( the Database Schema) • insert, update and delete data • maintain data persistently, with backup and recovery • handle transactions to support concurrent access to the database via locking et • optimise access by compilation of queries, indexing, replication of tables etc.

13. Application Layer • accepting requests from the Presentation layer • interpreting the requests according to business rules and past transactions from this client • requesting the appropriate data from the Persistence layer • computing derived data • creating the HTML (or GIF, MIDI..) for the page • providing run-time support for: • Thousands of concurrent users • compilation to machine code • multi-threading [ allow multiple processes to run concurrently] • caching [holding results in a temporary store to reduce re-calculation]

14. LAMP Architecture Linux Parameters Request Mozilla/IE Response Query Results Apache /IIS Running PHP interpreter HTTP MySQL Lynux, Apache, MySQL, PHP

15. History of PHP • PHP originally stood for “Personal Home Page” • It started out, in 1994, as a simple preprocessor of HTML files • built by Rasmus Lerdorf (born in Greenland, grew up in Denmark and Canada, graduated from U of Waterloo in 1993, now prominent member of Open Source movement) • original purpose was to log people who viewed his on-line resume • Since then, has been developed by a growing community of open source developers • Name now supposed to stand for “PHP Hypertext Pre-Processor”

16. PHP history (contd.) • Initially, PHP comprised a simple parser plus a library of C functions • The parser would scan a HTML file looking for instances of a new non-standard tag and replace the contents of these tag instances with the result of executing some functions in the C library • As a result, much PHP syntax looks like C • Other parts of it, however, have a Perl flavour – but, of course, Perl also borrows C syntax

17. Enabling PHP in HTTP servers • PHP is available on many servers today, in Windows and all types of Unix environments • It is supported by Apache, AOLServer, Roxen and others • Servers can be configured to enable PHP in different ways • The httpd recognizes a file who name has the suffix .php as a PHP file

18. Installing PHP on Windows • Install Apache web server (Accept the defaults) • Install MySQL • Optionally install the query browser and administrator • Create a folder to hold your web documents: C:\Documents and Settings\bduggan\My Documents\Courses\Web Development (China)\Websites

19. Install PHP • Unzip to c:/PHP • Rename the file c:\php\php.ini-dist to php.ini • Edit the line doc-root to read: • doc_root = C:\Documents and Settings\bduggan\My Documents\Courses\Web Development (China)\Websites • Edit the line extension-dir to read: • extension-dir=c:\php\ext • Edit http.conf and change: DocumentRoot "C:/Documents and Settings/bduggan/My Documents/Courses/Web Development (China)/Websites“ • Add: ScriptAlias /php/ "c:/php/" AddType application/x-httpd-php .php .php5 Action application/x-httpd-php "/php/php-cgi.exe" SetEnv PHPRC "C:/php“

20. Also Add: # # This should be changed to whatever you set DocumentRoot to. # <Directory "C:/Documents and Settings/bduggan/My Documents/Courses/Web Development (China)/Websites"> # # Possible values for the Options directive are "None", "All", # or any combination of: # Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews # # Note that "MultiViews" must be named *explicitly* --- "Options All" # doesn't give it to you. # # The Options directive is both complicated and important. Please see # http://httpd.apache.org/docs/2.2/mod/core.html#options # for more information. # Options Indexes FollowSymLinks # # AllowOverride controls what directives may be placed in .htaccess files. # It can be "All", "None", or any combination of the keywords: # Options FileInfo AuthConfig Limit # AllowOverride None # # Controls who can get stuff from this server. # Order allow,deny Allow from all </Directory>

21. Add: <Directory "C:/PHP"> # # Possible values for the Options directive are "None", "All", # or any combination of: # Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews # # Note that "MultiViews" must be named *explicitly* --- "Options All" # doesn't give it to you. # # The Options directive is both complicated and important. Please see # http://httpd.apache.org/docs/2.2/mod/core.html#options # for more information. # Options Indexes FollowSymLinks # # AllowOverride controls what directives may be placed in .htaccess files. # It can be "All", "None", or any combination of the keywords: # Options FileInfo AuthConfig Limit # AllowOverride None # # Controls who can get stuff from this server. # Order allow,deny Allow from all </Directory>

22. A first PHP file <html> <head> <title>PHP Test</title> </head> <body> <?phpecho “<p>Hello World</p>";?> </body> </html> Test this file and make sure PHP displays Hello World

23. Optionall install phpMyAdmin • This allows you to access MySQL in a web browser

24. How PHP files are processed • The httpd demon simply copies regular HTML content in the .php file to the message body that will be sent to a client which requests the .php file • The new non-standard tag is of the form <?php…?> • The text inside the tag is PHP code <?phpecho “<p>Hello World</p>";?> • The httpd demon executes this PHP code and copies the output text, generated by this PHP code, to the message body that will be sent to the client • Thus, from the above, the client would see only <p>Hello World</p>

25. Note following response: • Chunked transfer-encoding is used • Because the httpd demon does not know, before executing the PHP content, how long the message body will be • PHP code will been replaced, in the message body, by its output

26. PHP files are not special • PHP files do not have to be executable • They can be regarded as simply HTML files with some new tags

27. PHP tags • In the example just seen, the PHP tag was <?php … ?> • This is the best PHP tag to use – it is the one which works best if we are also using XML, because it avoids conflicts with XML Processing Instructions • However, you may occassionally see the following tags being used in other people’s PHP code: <? … ?> <% … %> <script language=“php”> … </script>