Chapter 9: Application Development

Database System Concepts, 7th Ed.

©Silberschatz, Korth and Sudarshan
See www.db-book.com
www.db-book.com for conditions on re-use
 Outline

 Application Programs and User Interfaces

 Web Fundamentals
 PHP
 phpMyAdmin
 PHP+MySQL

Database System Concepts - 7th Edition 9.2 ©Silberschatz, Korth and Sudarshan
 Application Programs and User Interfaces

 Most database users do not use a query language like SQL

 An application program acts as the intermediary between users and the
database
• Applications split into
 front-end
 middle layer
 backend
 Front-end: user interface
• Forms
• Graphical user interfaces
• Many interfaces are Web-based

Database System Concepts - 7th Edition 9.3 ©Silberschatz, Korth and Sudarshan
 Application Architecture Evolution

 Three distinct era’s of application architecture

• Mainframe (1960’s and 70’s)
• Personal computer era (1980’s)
• Web era (mid 1990’s onwards)
• Web and Smartphone era (2010 onwards)

Database System Concepts - 7th Edition 9.4 ©Silberschatz, Korth and Sudarshan
 Web Interface

Web browsers have become the de-facto standard user interface to

databases
 Enable large numbers of users to access databases from anywhere
 Avoid the need for downloading/installing specialized code, while
providing a good graphical user interface
• Javascript, Flash and other scripting languages run in browser,
but are downloaded transparently
 Examples: banks, airline and rental car reservations, university
course registration and grading, and so on.

Database System Concepts - 7th Edition 9.5 ©Silberschatz, Korth and Sudarshan
 The World Wide Web

 The Web is a distributed information system based on hypertext.

 Most Web documents are hypertext documents formatted via the
HyperText Markup Language (HTML)
 HTML documents contain
• text along with font specifications, and other formatting instructions
• hypertext links to other documents, which can be associated with
regions of the text.
• forms, enabling users to enter data which can then be sent back to the
Web server

Database System Concepts - 7th Edition 9.6 ©Silberschatz, Korth and Sudarshan
 Uniform Resources Locators

 In the Web, functionality of pointers is provided by Uniform Resource Locators (URLs).

 URL example:
https://www.php.net/manual/en/function.date.php
https://dev.mysql.com/doc/refman/9.0/en/window-function-descriptions.html#function_rank
https://www.google.com/search?q=silberschatz

https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_URL

Database System Concepts - 7th Edition 9.7 ©Silberschatz, Korth and Sudarshan
 Uniform Resources Locators

 Scheme indicates the protocol that the browser must use to request the
resource.
• “http” indicates that the document is to be accessed using the Hyper
Text Transfer Protocol. “https” is the secured version of http.
 Domain Name indicates which Web server is being requested.
 Port indicates the technical "gate" used to access the resources on the
web server. It is usually omitted if the web server uses the standard ports
of the HTTP protocol.
 Path to the file can be a physical file location on the Web server, and can
be an abstraction handled by Web servers without any physical reality.
 ?key1=value1&key2=value2 are extra parameters provided to the Web
server.
 #SomewhereInTheDocument is an anchor to another part of the resource
itself

Database System Concepts - 7th Edition 9.8 ©Silberschatz, Korth and Sudarshan
 HTML

 HTML is a markup language that used to markup parts of a document to

make them appear or act in a certain way when the document is viewed in
a web browser. HTML provides formatting, hypertext link, and image
display features
• including tables, stylesheets (to alter default formatting), etc.
 HTML also provides input features
 Select from a set of options
• Pop-up menus, radio buttons, check lists
 Enter values
• Text boxes
• Filled in input sent back to the server, to be acted upon by an
executable at the server

Database System Concepts - 7th Edition 9.9 ©Silberschatz, Korth and Sudarshan
 Example: test1.html
For more information, see https://devdocs.io/html/
head: information about the page and
how to process it

character encoding standard is

Unicode Transformation Format –
8-bit

body: things that should be

ancher
tag attribute hypertext reference
-- displayed

Database System Concepts - 7th Edition 9.10 ©Silberschatz, Korth and Sudarshan
 Sample HTML Source Text

<html>
<body>
<table border>
<tr> <th>ID</th> <th>Name</th> <th>Department</th> </tr>
<tr> <td>00128</td> <td>Zhang</td> <td>Comp. Sci.</td> </tr>
….
</table>
<form action="PersonQuery" method=“get” >
Search for:
<select name="persontype">
<option value="student" selected>Student </option>
<option value="instructor"> Instructor </option>
</select> <br>
Name: <input type=text size=20 name="name">
<input type=submit value="submit">
</form>
</body> </html>

Database System Concepts - 7th Edition 9.11 ©Silberschatz, Korth and Sudarshan
 Display of Sample HTML Source

Search for: Student

Name:
submit

Database System Concepts - 7th Edition 9.12 ©Silberschatz, Korth and Sudarshan
 table row table header table data

submission type is
“get” means
appending form
data into URL in
attribute
~ name=value pair.
~ name of the
that will submit
parameter you
This is the destination file to
which the data is submitted
to. It is not available. (Its
implementation in servlet is
on Page 412 of the
textbook.)

Database System Concepts - 7th Edition 9.13 ©Silberschatz, Korth and Sudarshan
 Client Side Scripting

 Browsers can fetch certain scripts (client-side scripts) or programs along

with documents, and execute them in “safe mode” at the client site
• Javascript
• Adobe Flash and Shockwave for animation/games
• VRML
• Applets (now defunct)
 Client-side scripts/programs allow documents to be active
• E.g., animation by executing programs at the local site
• E.g., ensure that values entered by users satisfy some correctness
checks
• Permit flexible interaction with the user.
 Executing programs at the client site speeds up interaction by
avoiding many round trips to server

Database System Concepts - 7th Edition 9.14 ©Silberschatz, Korth and Sudarshan
 Javascript
 Javascript very widely used
• Forms basis of new generation of Web applications (called Web 2.0
applications) offering rich user interfaces
 Javascript functions can
• Check input for validity
• Modify the displayed Web page, by altering the underling document
object model (DOM) tree representation of the displayed HTML text
• Communicate with a Web server to fetch data and modify the current
page using fetched data, without needing to reload/refresh the page
 Forms basis of AJAX (Asynchronous JavaScript and XML)
technology used widely in Web 2.0 applications
 E.g. on selecting a country in a drop-down menu, the list of states
in that country is automatically populated in a linked drop-down
menu

Database System Concepts - 7th Edition 9.15 ©Silberschatz, Korth and Sudarshan
 Javascript

 Example of Javascript used to validate form input

<html> <head>
<script type="text/javascript">
function validate() {
var credits=document.getElementById("credits").value;
if (isNaN(credits)|| credits<=0 || credits>=16) {
alert("Credits must be a number greater than 0 and less than 16");
return false
}
}
</script>
</head> <body>
<form action="createCourse" onsubmit="return validate()">
Title: <input type="text" id="title" size="20"><br />
Credits: <input type="text" id="credits" size="2"><br />
<Input type="submit" value="Submit">
</form>
</body> </html>

Database System Concepts - 7th Edition 9.16 ©Silberschatz, Korth and Sudarshan
Document
Object Model

Not
implemented
yet

Database System Concepts - 7th Edition 9.17 ©Silberschatz, Korth and Sudarshan
 PHP
 PHP is a programming language. It can create, manipulate, and output
data. It runs on a web server. The output of a PHP code, which is a
text, is sent to a browser. The text could contain html.
 Part of the remaining slides follow
PHP for Beginners by Dave Hollingworth on Udemy
https://www.udemy.com/course/php-for-beginners-/

 Part of the remaining slides

follow the book on the right:

Database System Concepts - 7th Edition 9.18 ©Silberschatz, Korth and Sudarshan
 client/server request/response sequence

Basic level

1. You enter http://server.com into your

browser.
2. Your browser consults DNS (domain name
system) to find the IP address of
server.com
3. Your browser issue a request for the home
page of server.com
4. The request crosses the internet and
arrives at the server.com web sever
5. The web server, having received the
request, look for web page on its disk.
6. The web server retrieves the page and
returns it to the browser.
7. Your browser displays the web page.

Database System Concepts - 7th Edition 9.19 ©Silberschatz, Korth and Sudarshan
 client/server request/response sequence
1. You enter http://server.com into your browser.
Dynamic Web page 2. Your browser consults DNS (domain name system)
to find the IP address of server.com
3. Your browser issue a request for the home page of
server.com
4. The request crosses the internet and arrives at the
server.com web sever
5. The web server, having received the request,
fetches web page from its disk.
6. With the home page now in memory, the web sever
notices that it is a file incorporating PHP scripting
and passes the page to the PHP interpreter.
7. The PHP interpreter executes the PHP code
8. Some of the PHP contains SQL statement, which
now PHP interpreter passes to MySQL database
engine.
9. The MySQL database returns the result of the
statements to the PHP interpreter.
10. The PHP interpreter returns the results of the
executed PHP code, along with the results from
MySQL database, to the web server.
11. The web server returns the page to the requesting
client, which displays it.
Database System Concepts - 7th Edition 9.20 ©Silberschatz, Korth and Sudarshan
 Install PHP on MacOS and Windows

 Mac
• Uninstall MySQL on Mac
• Install XAMPP on Mac
 Windows
• Uninstall MySQL on Windows
 Uninstall MySQL.
 Remove the following three MySQL folders.

• Install XAMPP on Windows

Database System Concepts - 7th Edition 9.21 ©Silberschatz, Korth and Sudarshan
 MacOS: First, uninstall MySQL on Mac
1. open system settings to find MySQL 2. press uninstall

3. select “Also……” and press OK

4. To uninstall MySQL Workbench from

macOS, locate MySQL Workbench in the
Application folder, right-click, and select
“Move to Trash”.

Database System Concepts - 7th Edition 9.22 ©Silberschatz, Korth and Sudarshan
 MacOS: Then, install XAMPP
In order to develop code locally on my computer, I need to
stall a web server, a database server. XAMPP can install
and config all of these (Apache web server with php,
mariadb database, phpMyAdmin) for you all at once.
A replacement for MySQL. MySQL code
and data are 100% compatible with
MariaDB
www.apachefriends.org

Database System Concepts - 7th Edition 9.23 ©Silberschatz, Korth and Sudarshan
 MacOS: Install of XAMPP
1. Double click the dmg file

3. Control + click to open

2. Double click the installer Even though you see a warning, you should try
installing the app anyway. To do it, hold down
Control and click on the app, then select “Open”
from the context menu.

4. Press next

Database System Concepts - 7th Edition 9.24 ©Silberschatz, Korth and Sudarshan
 MacOS: Install of XAMPP
5. 6.

7. 8. XAMPP is now launched.

Database System Concepts - 7th Edition 9.25 ©Silberschatz, Korth and Sudarshan
 MacOS: Install of XAMPP
9. Create a folder (which I called www, but it can be
any name and can be placed anywhere) to store the
files in the future.
10. Stop the “Apache Web server”, Press “Configure"
button, Open Conf File, Search for “DocumentRoot”
11. Replace the two
“/Applications/XAMPP/xamppfiles/htdocs” by the path
to the folder: /Users/jliu/teaching/database/www
12. Save the change. Press “OK”. Start “Apache web
server” again.

Database System Concepts - 7th Edition 9.26 ©Silberschatz, Korth and Sudarshan
 Windows

 See the appendix for install XAMPP on windows.

Database System Concepts - 7th Edition 9.27 ©Silberschatz, Korth and Sudarshan
 A simple PHP program: Hello World
1. The address of the web server install on my computer is local host. When web server
is running, it sits and waits for request for files. The requests normally come from web
browsers.

2. When you type the address of a web server into your web browser, it requests the site
from the web server. The web server receives the requests and sends the requested file
back.

3. When a php file on the server is requested, the web server first executes the php code,
then the results of executing that code are sent to the browser. (php runs on the web
server, not in the browser.)
opening php tag. No closing tag. See
database.php on Page 60

Database System Concepts - 7th Edition 9.28 ©Silberschatz, Korth and Sudarshan
 Variables and function in PHP

# of seconds of one
day
~

concatenation

https://www.php.net/manual/en/
function.date.php

https://www.php.net/manual/en/l
anguage.constants.magic.php

Database System Concepts - 7th Edition 9.29 ©Silberschatz, Korth and Sudarshan
 “foreach ... as” loop
Control flow in PHP

right click the webpage and choose

‘view page source’ or ’inspect’

Database System Concepts - 7th Edition 9.30 ©Silberschatz, Korth and Sudarshan
 “View Source” and “Inspect”

 In Chrome, “View Source” shows the HTML that was delivered from
the web server to your browser.
 In Chrome, Inspect elements is a developer tool to look at the state
of the DOM (Document Object Model) tree after the browser has
applied its error correction and after any Javascript have
manipulated the DOM.

Database System Concepts - 7th Edition 9.31 ©Silberschatz, Korth and Sudarshan
 Recall
1. You enter http://server.com into your browser.
Dynamic Web page 2. Your browser consults DNS (domain name system)
to find the IP address of server.com
3. Your browser issue a request for the home page of
server.com
4. The request crosses the internet and arrives at the
server.com web sever
5. The web server, having received the request,
fetches web page from its disk.
6. With the home page now in memory, the web sever
notices that it is a file incorporating PHP scripting
and passes the page to the PHP interpreter.
7. The PHP interpreter executes the PHP code
8. Some of the PHP contains SQL statement, which
now PHP interpreter passes to MySQL database
engine.
9. The MySQL database returns the result of the
statements to the PHP interpreter.
10. The PHP interpreter returns the results of the
executed PHP code, along with the results from
MySQL database, to the web server.
11. The web server returns the page to the requesting
client, which displays it.
Database System Concepts - 7th Edition 9.32 ©Silberschatz, Korth and Sudarshan
 PHP arrays

Main types of arrays: Numeric and associative

• Numeric array
• Associates a numeric index with each element in the array
• Indexes are integer numbers
• Start at zero
• Grow incrementally

• Associative array
• Provides pairs of (key => value) elements
https://www.php.net/manual/en/language.types.array.php

Example: Output:
Mixed int and
string keys

Database System Concepts - 7th Edition 9.33 ©Silberschatz, Korth and Sudarshan
 Associative arrays in PHP

" "means " ? Php "

= echo

Database System Concepts - 7th Edition 9.34 ©Silberschatz, Korth and Sudarshan
 view source
In Google Chrome, right click the web page and choose “view page source”

Database System Concepts - 7th Edition 9.35 ©Silberschatz, Korth and Sudarshan
 Associative arrays in PHP

Database System Concepts - 7th Edition 9.36 ©Silberschatz, Korth and Sudarshan
 phpMyAdmin

Database System Concepts - 7th Edition 9.37 ©Silberschatz, Korth and Sudarshan
 phpMyAdmin

1. Choose SQL tab to enter the query and then press go. (You can also
directly choose the Databases tab to create a database.)

Database System Concepts - 7th Edition 9.38 ©Silberschatz, Korth and Sudarshan
 phpMyAdmin
2.Choose Databases tab. Click university 3. university database is chosen

Database System Concepts - 7th Edition 9.39 ©Silberschatz, Korth and Sudarshan
 phpMyAdmin
4. Click import tab. Choose file DDL.sql (obtained from db-book.com). Press import.

5. Similary, import
smallRelationsInsertFile.sql or
largeRelationsInsertFile.sql

Database System Concepts - 7th Edition 9.40 ©Silberschatz, Korth and Sudarshan
 phpMyAdmin
7. Result

6. Enter the query. Press go.

Database System Concepts - 7th Edition 9.41 ©Silberschatz, Korth and Sudarshan
 Create a new database and insert data

 Click “server: localhost” from the last figure. Then choose “Databases” tab.
 Enter “cms” (content management system) and then press “create”

Database System Concepts - 7th Edition 9.42 ©Silberschatz, Korth and Sudarshan
 Create a database and insert data

 Enter “article” for Table name and 4 for Number of columns. Then press
“create”

Database System Concepts - 7th Edition 9.43 ©Silberschatz, Korth and Sudarshan
 Create a database and insert data

Enter the following information and then press “save”.

I auto increment

Database System Concepts - 7th Edition 9.44 ©Silberschatz, Korth and Sudarshan
 Create a database and insert data

Choose “Insert”. Enter two records (I only showed one). Then press go.

Then run “select * from article;” in “SQL” tab to see results:

Database System Concepts - 7th Edition 9.45 ©Silberschatz, Korth and Sudarshan
 Create another user

 Select Database: cms from the red box in the last figure. Choose
“Privileges” tab. Then click “Add user account”. Enter information. Then
press “go” in the bottom.

choose your own user

Database System Concepts - 7th Edition 9.46 ©Silberschatz, Korth and Sudarshan
 Remark: To use MySQL/MariaDB in Python

output:

Database System Concepts - 7th Edition 9.47 ©Silberschatz, Korth and Sudarshan
 index_firststep.php
2. Enter http://localhost/index_firststep.php in a browser
1. Place this file index_firststep.php in
the folder you created on Page 26.

user created on Page 46

Database System Concepts - 7th Edition 9.48 ©Silberschatz, Korth and Sudarshan
  https://www.php.net/manual/en/mysqli.construct.php
• mysqli_connect — Open a new connection to the MySQL server
 https://www.php.net/manual/en/mysqli.connect-error.php
• mysqli_connect_error — Returns a description of the last connection error
 https://www.php.net/manual/en/mysqli.query.php
• mysqli_query — Performs a query on the database
 https://www.php.net/manual/en/mysqli.constants.php#constant.mysqli-
assoc
• Predefined Constant MYSQLI_ASSOC : Fetch associative array. Columns are
returned into the array having the fieldname as the array index.

Database System Concepts - 7th Edition 9.49 ©Silberschatz, Korth and Sudarshan
 Index_secondstep.php file

Database System Concepts - 7th Edition 9.50 ©Silberschatz, Korth and Sudarshan
 Modify the database, the webpage changes
1. Modify the database

2. The webpage
changes accordingly.

Database System Concepts - 7th Edition 9.51 ©Silberschatz, Korth and Sudarshan
 HTTP Request Methods
 Recall: A client (browser) sends an HTTP request to the server; then
the server returns a response to the client.
 The two most common HTTP request methods for browser to sent
user input are GET and POST.
 The GET method is used to request data from a specified resource.
The query string (name/value pairs) is sent in the URL.
 The POST method is used to send data to a server to create/update a
resource. No data in the URL. The web server bundles up all the user
input into an associative array named $_POST

Database System Concepts - 7th Edition 9.52 ©Silberschatz, Korth and Sudarshan
 Passing data in the URL
https://www.php.net/reserved.variables.server
• $_SERVER is an array containing information such as headers, paths, and script
locations.
• Entry 'QUERY_STRING’ of $_SERVER is the query string (name/value pairs) which is
sent in the URL of a GET request.
• Entry ‘REQUEST_METHOD’ of $_SERVER tells which request method was used to
access the page; e.g. 'GET', 'HEAD', 'POST', 'PUT’.

https://www.php.net/manual/en/reserved.variables.get.php
• $_GET is an associative array passed to the current script via the URL parameters
(aka. query string).
on the server HTTP works as a request-response
protocol between a client and server.

A client (browser) sends an HTTP request

to the server; then the server returns a
response to the client.

Database System Concepts - 7th Edition 9.53 ©Silberschatz, Korth and Sudarshan
 Index.php file

Database System Concepts - 7th Edition 9.54 ©Silberschatz, Korth and Sudarshan
 article.php file

$_GET is an associative array passed to

the current script via the URL
parameters

Only 1 record.
Fetch it as an
associative array

Database System Concepts - 7th Edition 9.55 ©Silberschatz, Korth and Sudarshan
Database System Concepts - 7th Edition 9.56 ©Silberschatz, Korth and Sudarshan
 Save data to database

1.Open
new_article.php

Method is “post” means

2.Write appending form data
something then inside the body of the
press “Add” HTTP request.
Action attribute is
missing means the form
will be submitted to the
current php file.

3. It shows
“Inserted record
with ID: 4”

Database System Concepts - 7th Edition 9.57 ©Silberschatz, Korth and Sudarshan
 Save data to database

4.

5.

Database System Concepts - 7th Edition 9.58 ©Silberschatz, Korth and Sudarshan
  A HTML form submits information via the HTTP POST method if the
form's method attribute is set to "POST".

 https://www.php.net/manual/en/mysqli.insert-id.php
• mysqli_insert_id — Returns the value generated for an AUTO_INCREMENT column
by the last query

Database System Concepts - 7th Edition 9.59 ©Silberschatz, Korth and Sudarshan
 ~ skipped
Break code into pieces

Database System Concepts - 7th Edition 9.60 ©Silberschatz, Korth and Sudarshan
 Part 2 of Project 2
1. Changed the type of ID in table student from varchar(5) to, say, varchar(15).

2. Create the following user with associated password

Database System Concepts - 7th Edition 9.61 ©Silberschatz, Korth and Sudarshan
 Part 2 of Project 2

3. Submit enrol_YourStudentIDStartingWithA.php which is a single file. It

enables me (as user adam with password shown in the step 2) to add you to
the student table in university database. After pressing “Add”, it shows the
total number of students in related department.

Database System Concepts - 7th Edition 9.62 ©Silberschatz, Korth and Sudarshan
 Summary

• PHP scripting language

• Use phpMyAdmin to create and update a database.
• Retrieve data from a database and display them on a
web page.
• How to use forms to update a database.

• The first part of the second project will be announced

on Saturday, after the lecture.
• Submit solutions to both parts, which contain an .sql
file and a .php file to canvas->assignments->project2
after 2 weeks.

Database System Concepts - 7th Edition 9.63 ©Silberschatz, Korth and Sudarshan