Server-Side Scripting/Routes and Templates/PHP

From Wikiversity
Jump to navigation Jump to search

index.html[edit | edit source]

<!-- 
Demonstrates a complete server-side website using:
  * static HTML and CSS
  * a template
  * a code module

NOTE: The PHP webserver routes page requests automatically.
No code-based routing is necessary.

Folder structure:
hello.php
index.html
static.html
styles.css
template.php

References:
    https://www.php.net/manual/en/tutorial.firstpage.php
    https://www.dummies.com/web-design-development/html5/using-templates-with-php/

-->

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Hello World</title>
  </head>
  <body>
      <h1>Hello World</h1>
      <ul>
          <li><a href="static.html">Static</a></li>
          <li><a href="template.php">Template</a></li>
          <li><a href="hello.php">Code</a></li>
      </ul>
  </body>
</html>

hello.php[edit | edit source]

<?php

// Displays "Hello world!"
//
// References:
//  https://repl.it/languages/php7
//  https://www.php.net/manual/en/tutorial.firstpage.php

echo "Hello code world!";

?>

static.html[edit | edit source]

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Hello World</title>
    <link rel="stylesheet" href="styles.css">    
  </head>
  <body>
    <p>Hello static world!</p>
  </body>
</html>

styles.css[edit | edit source]

body {
    color: blue;
    font-family: Arial, Helvetica, sans-serif;
    font-size: larger;
}

template.php[edit | edit source]

<?php 

$greeting = "Hello";
$name = "world";

?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Hello World</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <p><?=$greeting?> template <?=$name?>!</p>
  </body>
</html>

Try It[edit | edit source]

Copy and paste the code above into the following free online development environment or use your own PHP compiler / interpreter / IDE.

See Also[edit | edit source]