Dynamische Webseiten: Einstieg in HTML, PHP und MySQL

Marco Schuchmann

• Verlag: Books on Demand
• Jahr: 2019
• ISBN drucken: 9783837066111
• eBook-ISBN: 9783848270460
• Auflage: 10
• Thema: Informatik
• Thema: Informatik Allgemein

In diesem Buch werden zunächst Grundlagen zu HTML, MySQL und PHP vermittelt, mit denen man dynamische Webseiten erstellen kann. Danach wird beschrieben, wie man mit diesen Grundlagen kleinere Anwendungen programmieren kann, wie ein einfaches Browsergame oder einen Chat.Programme und weitere Beispiele werden auf einer Webseite für dieses Buch bereitgestellt. Diese Auflage wurde mit PHP-Programmen bzgl. der Verwendung von MySQLi ergänzt, was ab PHP 7 notwendig wurde.

1 Einleitung

In diesem Buch werden zunächst Grundlagen zu HTML, MySQL und PHP vermittelt, mit denen man dynamische Webseiten erstellen kann. Danach wird beschrieben, wie man mit diesen Grundlagen kleinere Anwendungen programmieren kann, wie ein einfaches Browsergame oder einen Chat. Falls man die Programme nicht selbst eingeben möchte, können diese unter der Adresse www.galaxieswar.de/Buch herunter geladen werden.

HTML dient zur Formatierung einer Webseite. Hiermit kann ein Text formatiert, Bilder, Tabelle oder auch Hyperlinks eingefügt werden. Außerdem kann man mit HTML ein Formular für die Eingabe von Daten (z.B. Namen oder Adressen) erstellen. Für die Eingabe der beschriebenen HTML-Kommandos können beliebige HTML-Editoren verwendet werden. Diese kann man auch als Freeware im Internet herunterladen, wobei es auch kommerzielle Editoren wie Frontpage oder Dreamweaver gibt. Wir können aber für die Eingabe der HTML- und PHP-Kommandos auch einfach einen Editor, wie z.B. den Windows-Editor, verwenden.

PHP ist eine serverseitige Programmiersprache. Damit läuft ein PHP-Programm auf einem Server ab und nicht bei dem, der sich die entsprechende Seite anschaut. Im Gegensatz zu Javascript, dass beim Anwender abläuft. D.h. mit PHP kann man beispielsweise keine Grafik verändern, sobald sich die Maus über der Grafik bewegt. Sollen aber Daten in einer Datenbank gespeichert werden, auf die andere zugreifen können, oder sollen Daten zwischen zwei Personen - die sich an verschiedenen PCs eine Seite ansehen - ausgetauscht werden (z.B. bei einem Forum, Chat, oder auch Browsergames mit mehreren Spielern), dann benötigt man eine serverseitige Programmiersprache, wie PHP.

Grundsätzlich funktioniert es so, dass eine Eingabe (z.B. über ein HTML-Formular) von einem Anwender an einen Server geschickt wird, auf dem sich PHP und MySQL befinden. Dabei wird beispielsweise eine Seite, die sich auf dem Server befindet, durch das Abschicken eines HTML-Formulars aufgerufen. Auf dem Server wird dann das PHP-Programm, welches in diese Seite eingebunden ist, abgearbeitet. Hier können dann auch gesendete Daten beispielsweise in einer MySQL-Datenbank gespeichert werden. Die Seite, die der Anwender aber in seinem Browser sieht, enthält nur HTML-Anweisungen. Somit sehen Anwenderinnen und Anwender auch nicht die dahinterstehenden Programmen.

Möchte man seine geschriebenen PHP-Programme testen, so könnte man die entsprechenden Seiten auf den Server eines Providers laden und sich diese im Browser ansehen.

Oder man erstellt zu Hause einen eigenen Server, den man zum Testen von PHP-Programmen verwendet. Mit ein paar einfachen Schritten kann man ganz schnell seinen eigenen PC oder Laptop zu einem Apache-Server machen.

Wir verwenden im Folgenden das Paket XAMPP, um nicht PHP, MySQL und den Apache-Server einzeln installieren zu müssen. In diesem Paket sind Freeware-Tools enthalten.

Installation von XAMPP:

Als erstes kann das XAMPP Paket heruntergeladen werden, welches den Apache-Server, PHP, MySQL und einige andere Tools enthält.

XAMPP kann auf der Internetseite www.apachefriends.org heruntergeladen werden. Lädt man die Installer-Version von XAMPP, dann kann man Apache und MySQL als Dienst installieren oder diese Dienste im Contol Panel aktivieren (siehe nächste Abbildung), indem man jeweils daneben auf "Start" klickt. Die Ikone zum Starten des XAMPP Control Panels befindet sich nach der Installation auf dem Desktop oder im Startmenü, wenn man Windows verwendet (wobei das Programm auch im XAMPP-Verzeichnis zu finden ist).

Man könnte auch Apache und MySQL als Service installieren, womit nach jedem Neustart des PCs die Tools automatisch zur Verfügung stehen.

Um sich die HTML-Seiten ansehen zu können, wird kein Server benötigt. Dazu kann man einfach doppelt auf eine Seite mit der Endung html klicken, wobei diese dann über einen Browser geöffnet wird. Diese geht selbst dann, wenn diese HTML-Seiten Javascript-Programme enthalten, denn Javascript wird vom Browser „interpretiert“.

Für die Verwendung der PHP-Beispiele muss Apache gestartet werden und für die MySQL-Beispiele muss zusätzlich auch MySQL gestartet werden. Dies kann man, wie oben beschrieben, mit dem Control Panal tun.

Alle PHP-Dateien müssen aber im Verzeichnis c:\XAMPP\htdocs stehen und man kann sich im Gegensatz zu reinen HTML- und Javascript-Seiten, wie oben beschrieben, Resultate von PHP-Programmen nur ansehen, wenn man diese im Browser über die Serveradresse öffnet. Falls Du einen Browser öffnest und die URL („www-Adresse“) http:\\localhost eingibst, landest Du automatisch in diesem Verzeichnis, d.h. es werden Dateien aus diesem Verzeichnis angezeigt und PHP-Programme werden "ausgewertet". PHP-Programme werden, wie wir später noch sehen, in HTML-Seiten eingebaut, wobei die Datei dann die Endung php haben muss. Befindet sich in einem Verzeichnis eine Datei mit dem Namen index.html oder index.php, so wird nie der Inhalt des Verzeichnisses angezeigt, sondern nur diese Datei.

Für alle PHP-Programme, die noch geschrieben werden, kannst Du unter c:\XAMPP\htdocs beispielsweise ein Verzeichnis mit dem Namen „Beispiele“ anlegen und hier eventuell Unterverzeichnisse für verschiedene Typen von Beispielen. Den Inhalt dieses Ordners sieht man dann im Browser, wenn dort „localhost/Beispiele“ eingegeben wird und sich noch keine Index-Datei darin befindet.

Bemerkungen:

• Alle HTML- und PHP-Dateien für diverse Beispiele können unter www.galaxieswar.de/Buch herunter geladen werden. Hier werden auch Infos und Downloads zum Buch bereitgestellt. Gerade bei Änderungen, wie beispielsweise von der Umstellung von mysql auf mysqli.
• Bei den folgenden Beispielen können auch andere Namen für die HTML- und PHP-Seiten verwendet werden. Die Seitennamen sollten aber möglichst keine Leerzeichen enthalten. Falls Du das Betriebsystem Linux verwendest oder Seiten auf den Webspace bei einem Provider stellst, musst Du auch bei den Seitennamen die Klein-/Großschreibung beachten. Auf vielen Servern ist das Betriebssystem Linux installiert.
• Ab PHP 7 stehen die PHP-Befehle/Funktionen mysql_... zum Zugriff auf MySQL-Datenbanken nicht mehr zur Verfügung, die neuen Funktionen heißen mysqli_... . Hier wird dann der Einfachheit halber von MySQLi gesprochen, obwohl die MySQL-Befehle dieselben sind, es geht nur um die Zugriff von PHP auf MySQL.

Hier sind einige Seiten, auf denen man sich über HTML, PHP und MySQL informieren kann:

www.apachefriends.org, www.mysql.de, www.php.de, www.phpforum.de, www.selfhtml.org

Achtung: Ich kann keine Verantwortung für die Inhalte unter angegebene Links übernehmen und distanziere mich auch von Inhalten angegebener Links und Links auf angegebenen Seiten!

2 HTML-Einführung

Die Hypertext Markup Language (HTML) ist ein Dokumentenformat bzw. eine Kennzeichnungssprache (nicht mit einer Programmiersprache zu verwechseln) für Webseiten. HTML wird für die optische Gestaltung einer Internetseite verwendet. Mit ihr wird der Seitenaufbau wie z.B. die Zeilenumbrüche, die Überschriften usw. festgelegt. HTML-Dokumente bestehen zum größten Teil aus Texten und Anweisungen, die zur Textformatierung benötigt werden. Solche Anweisungen werden TAGs genannt, wobei die Groß- und Kleinschreibung in dem hier verwendeten HTML-Programm keine Rolle spielt (im Gegensatz zu PHP). HTML-Seiten können mit jedem beliebigen Text-Editor bearbeitet werden (die keine speziellen Steuerzeichen einfügt, wie z.B. bei Word).

In den TAGs können, wie wir später sehen werden, Optionen eingebaut werden mit <TAG Option1 Option2 …> und es können auch sogenannte Eventhandler eingefügt werden. Mit Eventhandlern können bei bestimmten Aktionen des Benutzers (bei einem Mausklick oder falls die Maus über einem Bild bewegt wird) eine Javascript-Funktion oder Anweisung ausgeführt werden.

Im HTML-Quellcode gesetzte Leerzeichen, Einrückungen und Zeilenumbrüche werden vom Webbrowser als solche ignoriert. Mit dem TAG <PRE>…</PRE> jedoch, kann man einen präformatierten Text einfügen. Der Text wird dann später so ausgegeben, wie man ihn eingegeben hat, d.h. mit Zeilenumbrüchen und Leerzeichen.

Um den Text mit Überschriften, verschiedenen Schriftarten, oder auch einfachen Textformatierungen, wie Kursiv- bzw. Fettschrift zu verschönern, gibt es viele verschiedene TAGs. Mit Verschachtelungen von HTML-Befehlen ist es möglich verschiedene Befehle miteinander zu kombinieren, z.B. um ...

Inhaltsverzeichnis

• Inhaltsverzeichnis
• 1. Einleitung
• 2. HTML-Einführung
• 3. MySQL
• 4. Einstieg in die PHP-Programmierung mit Beispielen
• Impressum