Struktur einer Web-Applikation
als Präsentation ▻An einem Beispiel lernen wir nun den typischen Aufbau einer einfachen Web-Applikation kennen. Die fertige Applikation soll Werke und Personen aus einem Portfolio anzeigen:
Idee und erste Skizzen
Wireframes, Prototype
Aufbau der Applikation
Die folgende Tabelle zeigt alle (geplanten) Seiten der Applikation im Überblick. Zu jeder Seite wird der Titel angeführt (wird auf der Seite angezeigt), der Dateiname der PHP-Datei (wichtig für die Verlinkung), eventuell notwendige Parameter und eine Beschreibung was die Seite anzeigt.
| Titel | Dateiname | Parameter | Beschreibung |
|---|---|---|---|
| Home | index.php | Zeigt Gesamtzahl der Personen und Werke an, sowie Bilder von 10 zufälligen Werken | |
| Personen | personen.php | Zeigt alle sichtbaren Profile an, mit Links zu person.php | |
| Personensuche | psuche.php | Zeigt Ein Such-Formular für Personen an | |
| Personensuche | psuche.php | suchwort | Zeigt alle sichtbaren Profile an, wo Vor- oder Nachname like suchwort |
| Profil einer Person | person.php | id (Schlüssel der Person) | Zeigt Details zu einer bestimmten Person an: Anzahl der Werke und Username |
| Werke | werke.php | Zeigt alle sichtbaren Werke an, mit Links zu werk.php | |
| Details zu einem Werk | werk.php | id (Schlüssel des Werks) | Zeigt Details zu einer bestimmten Werk an: Titel, Datum der Publikation, eventuell eine Liste der Beteiligten Personen und ihrer Rollen |
| Werksuche | wsuche.php | Zeigt Ein Such-Formular für Werke an | |
| Werksuche | wsuche.php | suchwort | Zeigt alle sichtbaren Werke an, wo Titel like suchwort |
Verlinkung
In der Datei personen.php wird zu jeder Person ein passender Link zu person.php angezeigt:
<li>
<b>Michael A</b>
<a href="person.php?id=577">mehr</a>
</li>
<li>
<b>Benjamin A</b>
<a href="person.php?id=579">mehr</a>
</li>Datensätze suchen
In der Datei psuche.php wird ein Formular zur Suche nach Vornamen angezeigt:
<form action="psuche.php" method="get">
Suche nach einer Person mit Namen <input name="suchwort">
<input type="submit">
</form>Siehe auch
Die Rolle der URL in der Web-Architektur: Ahmad Alfy’s Your URL Is Your State