IS 1500 Introduction to Web Development Dynamic Websites

IS 1500: Introduction to Web Development Dynamic Websites with PHP Martin Schedlbauer, Ph. D. m. schedlbauer@neu. edu

Dynamic Websites • Websites with just content pages are called static websites. • Dynamic websites collect data and display pages that are generated right before being sent to the browser. IS 1500 Dynamic Websites with PHP 2

Example of a Static Website • Adding additional players requires that a web developer modify the page and then republish the page. • This is time consuming, error prone, and expensive. IS 1500 Dynamic Websites with PHP 3

Better Approach: Dynamic Pages • Why not put the information into a database and then write code to extract the information and build a page programmatically? • Then, to modify the page, only additional data to the database. IS 1500 Dynamic Websites with PHP 4

Dynamic Page Generation From http: //blog. search 3 w. com/dynamic-to-static/hello-world/ IS 1500 Dynamic Websites with PHP 5

Scripting Engines • There are several server-side scripting engines that use different programming languages: – PHP as the scripting language accessing data from a relational database, most commonly My. SQL – Ruby on Rails using My. SQL – ASP. NET using SQL Server or Microsoft Access IS 1500 Dynamic Websites with PHP 6

Common Technology Stacks • LAMP/WAMP: – Linux or Windows as the server operating system – Apache as the web server – My. SQL as the database – PHP as the dynamic page scripting language IS 1500 Dynamic Websites with PHP 7

Our Stack • We are using a simplified stack requiring less programming experience: – Hosted server (Award. Space/Weebly) – Hosted web development platform (Award. Sapce) – Database (My. SQL) – Dynamic page scripting language (PHP) IS 1500 Dynamic Websites with PHP 8

Dynamic Page Generation in PHP Internet Generated HTML PHP Program HTML + PHP Script • Database Browser IS 1500 Dynamic Websites with PHP 9

Data: Definition & Generation • A database is a collection of tables containing records each of which has fields. • The My. SQL database is a “relational database”. • Administration is done through the PHPAdmin 3 web tool. IS 1500 Dynamic Websites with PHP 10

Steps for Creating Dynamic Pages 1. create a database 2. define tables for the database 3. add data to the database or build a form that collects data and stores it in the tables 4. write PHP program to build HTML page with data from database 5. integrate PHP program into website IS 1500 Dynamic Websites with PHP 11

Step 4: The PHP Program <? php $servername = "pdb 18. awardspace. net"; $username = "1236683_bruins"; $password = "4 Boston. Bruins"; $database = "1236683_bruins"; $port = "3306"; // Create connection $conn = mysqli_connect($servername, $username, $password, $database, $port); // Check connection if (!$conn) { die("Connection failed: ". mysqli_connect_error()); } $sql = "SELECT * FROM players"; $result = $conn->query($sql); if ($result->num_rows > 0) { // create table structure echo "<table border=0>"; // output data of each row: a single player with picture and name while($row = $result->fetch_assoc()) { echo "<tr>"; echo "<td><img src='". $row["p_image"]. "' width=100 height=120/></td>"; echo "<td valign=top style='color: darkgray'>"; echo $row["p_name"]. " (". $row["p_pos"]. ")</td>"; echo "</tr>"; } echo "</table>"; } else { echo "0 results"; } ? > IS 1500 Dynamic Websites with PHP 12

PHP: Connecting to the Database <? php $servername = "pdb 18. awardspace. net"; $username = "1236683_bruins"; $password = "4 Boston. Bruins"; $database = "1236683_bruins"; $port = "3306"; // Create connection $conn = mysqli_connect($servername, $username, $password, $database, $port); // Check connection if (!$conn) { die("Connection failed: ". mysqli_connect_error()); } IS 1500 Dynamic Websites with PHP 13

PHP: Retrieving Data with SQL $sql = "SELECT * FROM players"; $result = $conn->query($sql); This is the name of the table you created in the My. SQL database. Look at the table names using PHPAdmin 3 IS 1500 Dynamic Websites with PHP 14

PHP: Displaying the Data by Row if ($result->num_rows > 0) { // create table structure echo "<table border=0>"; // output data of each row: a single player with picture and name while($row = $result->fetch_assoc()) { echo "<tr>"; echo "<td><img src='". $row["p_image"]. "' width=100 height=120/></td>"; echo "<td valign=top style='color: darkgray'>"; echo $row["p_name"]. " (". $row["p_pos"]. ")</td>"; echo "</tr>"; This is the name of the } column you specified when echo "</table>"; you created the table. <table border=0> <tr><td><img src='http: //bit. ly/1 CWFXUv' width=100 height=120/></td> <td valign=top style='color: darkgray'>Tuuka Rask (Goalie)</td></tr> <tr><td><img src='http: //cdn. agilitycms. com/nhlpacom/27205. jpg' width=100 height=120/></td> <td valign=top style='color: darkgray'>Patrice Bergeron (Forward)</td></tr> <tr><td><img src='https: //er. cloudfront. net/465499052. jpg? ts=1425829465' width=100 height=120/></td> <td valign=top style='color: darkgray'>Brett Connolly (Forward)</td></tr> </table> IS 1500 Dynamic Websites with PHP 15

Dynamic Pages in Summary 1. define database My. SQL Database 3. Retrieve data and generate dynamic page via script 2. add data to database IS 1500 Dynamic Websites with PHP 16

Embedding into HTML • The simplest way is to add the URL as embedded <iframe> HTML tag: <iframe src="http: //is 1500 -mysql-sandbox. boatventures. us/load. Players. php" width='100%'> </iframe> IS 1500 Dynamic Websites with PHP 17

Database Checklist q. Tables name should not contain spaces q. Column names should not contain spaces q. Ensure that every table has a primary key which is generally a numeric ID field IS 1500 Dynamic Websites with PHP 18

Summary, Review, & Questions… IS 1500 Dynamic Websites with PHP 19
- Slides: 19