Módulo: Mecanizado (MEC)
advertisement
AF_IC01_U3. Activity
Unit 3. My first web application
Introduction
In this activity, we will introduce how a web application works, focusing on dynamic HTML
pages. This is a guided activity, and the aim is to understand the generation of HTML pages
though a scripting language.
Installation
Let’s begin with a Linux debian-like virtual machine, for instance Ubuntu. In order to install a
web server you must use the following commands:
$ sudo apt-get install tasksel
$ sudo tasksel install lamp-server
Remember the root password for MySQL.
Database
Once you have installed the web server, you must design a little database (one table). Every
student must choose a different subject (videogames, football…). Customize the following
example for your purposes (change what is needed).
$ mysql –u root -p
mysql> CREATE DATABASE DEMO;
mysql> SHOW DATABASES;
mysql> USE DEMO;
mysql> CREATE TABLE USER (
user_id INT NOT NULL AUTO_INCREMENT,
name VARCHAR(50),
city VARCHAR(50),
PRIMARY KEY (user_id)
);
mysql> SHOW TABLES;
mysql> INSERT INTO USER (name, city) VALUES
('Josep', 'Palamós'),
('Joan', 'Palafrugell'),
('Jordi', 'Pals');
mysql> SELECT * FROM USER;
Web application
Create 2 files, list.php and insert.php in the /var/www folder with the annex contents. Modify the
code in order to match with your database. Finally, load your application onto your favourite
browser by typing http://localhost/list.php. Try your web application and verify there are no
errors.
Extension
Find out how to edit or delete a record in order to make a full CRUD (Create, Read, Update,
Delete) web form.
AF_IC01_U3. My first web application / Unit 3
Annex
list.php
<html>
<body>
<h1>Users table</h1>
<?
// Database server connection
$connection = mysql_connect("localhost", "root", "root");
// Database selection
mysql_select_db("demo", $connection);
$qryUser = "SELECT * FROM USER";
$rsUser = mysql_query($qryUser, $connection) or die(mysql_error());
$iTotalUsers = mysql_num_rows($rsUser);
?>
<TABLE BORDER=1>
<TR><TH>Id</TH><TH>Name</TH><TH>City</TH></TR>
<?
if ($iTotalUsers> 0) {
while ($rowUser = mysql_fetch_assoc($rsUser)) {
echo "<TR>";
echo "<TD>".$rowUser['user_id']."</TD>";
echo "<TD>".$rowUser['name']."</TD>";
echo "<TD>".$rowUser['city']."</TD>";
echo "</TR>";
}
}
?>
</TABLE>
<BR>
<FORM ACTION="insert.php">
<TABLE>
<TR>
<TD>Name:</TD>
<TD><INPUT TYPE="text" NAME="name" SIZE="20" MAXLENGTH="50"></TD>
</TR>
<TR>
<TD>City:</TD>
<TD><INPUT TYPE="text" NAME="city" SIZE="20" MAXLENGTH="50"></TD>
</TR>
</TABLE>
<INPUT TYPE="submit" NAME="action" VALUE="Add">
</FORM>
</body>
</html>
AF_IC01_U3. My first web application / Unit 3
insert.php
<?php
// Database server connection
$connection = mysql_connect("localhost", "root", "root");
// Database selection
mysql_select_db("demo", $connection);
$name=$_GET['name'];
$city=$_GET['city'];
mysql_query("insert into
$connection);
USER
// Reload the previous page
header("Location: list.php");
?>
AF_IC01_U3. My first web application / Unit 3
(name,
city)
VALUES
('$name','$city')",
