Webdesign V (PHP Grundlagen)

In dieser Einheit wurde der Themenblock Webdesign zu einem Abschluss gebracht. Hierfür wurde die bisher bearbeitete HTML-Beispielseite komplett auf PHP umgerüstet, um noch abschließend die nächste Stufe des Web-Development ausprobiert zu haben. Nachdem die technischen Details rund um PHP (PHP: Hypertext Preprocessor - rekursives Akronym) sowie Webserver (Apache) und Datenbankserver (MySQLi) oder virtuelle Serverapplikationen wie XAMPP oder MAMP besprochen wurden, konnte schlussendlich die erste PHP-Datei erstellt und der erste echo-Befehl ausgeführt werden. Das neu erstellte PHP-Skript wurde im weiteren Verlauf für den Email-Versand vorbereitet, sodass die Eingaben des zuvor erstellten Kontaktformulars an eine bestimmte Email-Adresse gesendet werden. Außerdem wird je nach Versandstatus eine Warnmeldung vom Skript innerhalb des Browsers ausgegeben. Dabei wurden auch Felder wie der Captcha usw. berücksichtigt und als weitere Sicherheitsbarrieren innerhalb des Mail-Sendescripts implementiert.


Kompetenzen

  1. Ich kenne den Unterschied zwischen HTML und PHP und weiß wie PHP in Webseiten eingreifen kann.
  2. Ich verstehe wie Webserver und Datenbankserver im Hintergrund einer Webseite arbeiten und kenne virtuelle Applikationen.
  3. Ich weiß wie man HTML-Dokumente in PHP taugliche Seiten umwandelt und kann kleinere PHP Befehle in HTML-Dateien schreiben.
  4. Ich verstehe wie HTML Formulare in Bezug auf deren Aktionen (Skriptaufruf) und Methoden (POST) arbeiten.
  5. Ich kann kleinere PHP-Skripts erstellen und diese mittels $_POST-Variablen mit HTML-Formularen verknüpfen.
  6. Ich kann IF-ELSE-Anweisungen programmieren und verstehe das Prinzip hinter ihnen.
  7. Ich weiß wofür Visual Studio Code verwendet wird und wie man mit den beiden Entwicklungsumgebungen umgeht.


Vertiefung

index.php
<!DOCTYPE html>
<html>
  <head>
    <title>Seitentitel</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="responsive.css">
  </head>	
 
  <body>
    <main>
      <div class="row">
        <div class="col-12">
          <h1><?php echo 'Kontaktformular'; ?></h1>
          <form action="mail.php" method:"post">
            <fieldset>
              <legend>Sende mir über dieses Formular eine Nachricht</legend>
              <label>Name:</label><br>
              <input type="text" name="inputName" placeholder="Dein Name..." required="required"><br>
              <label>Email:</label><br>
              <input type="email" name="inputMail" placeholder="Deine Email Adresse..." required="required"><br>
              <label>Nachricht:</label><br>
              <textarea id="inputNachricht" name="inputNachricht" rows="9" cols="55" placeholder="Deine Nachricht..." required="required"></textarea><br>
              <br><br>
              <input type="submit" value="Absenden">
              <input type="reset" value="Zurücksetzen">
            </fieldset> 
          </form>
        </div>
      </div>
    </main>		
  </body>
</html>
mail.php
<?php
$usrname = $_POST['inputName'];
$usrmail = $_POST['inputMail'];
$usrmessage = $_POST['inputNachricht'];
 
$to = "max.mustermann@hotmail.com";
$subject = "Kontaktformular - Neue Email";
 
$message = '<html>
                <head>
                    <title>Kontaktformular - Neue Email</title>
                </head>
                <body>
                    <p><b>Du hast soeben eine neue Email erhalten!</b></p></br>
                    <p><b>Name:</b> '.$usrname.'</p>
                    <p><b>Email:</b> '.$usrmail.'</p>
                    <p><b>Nachricht:</b></p>
                    <p>'.$usrmessage.'</p>
                </body>
            </html>';
 
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= 'From: '.$usrmail.'' . "\r\n";
 
if (mail($to,$subject,$message,$headers)) {
    echo '<script> alert("Nachricht erfolgreich zugestellt!"); window.location.href="index.php"; </script>';
}
else {
    echo '<script> alert("Nachricht nicht zugestellt!"); window.location.href="index.php"; </script>';
}
?>



Unterrichtsmaterialien


, , , , , , , , , , , ,