Grundlegendes zu Webanwendungen

Die Benutzeroberfläche wurde in Dreamweaver vereinfacht. Daher kann es sein, dass einige der in diesem Artikel beschriebenen Optionen in Ihrer Version von Dreamweaver nicht vorhanden sind. Weitere Informationen finden Sie in diesem Artikel.

Webanwendungen

Eine Web-Anwendung ist eine Website, die Seiten mit teilweise oder vollständig unbestimmtem Inhalt enthält. Der endgültige Inhalt einer Seite wird erst bestimmt, wenn der Besucher eine Seite vom Webserver anfordert. Da der endgültige Inhalt der Seite von Anfrage zu Anfrage basierend auf den Aktionen des Besuchers variiert, wird diese Art von Seite als dynamische Seite bezeichnet.

Webanwendungen werden entwickelt, um eine Vielzahl von Herausforderungen und Problemen zu lösen.Dieser Abschnitt beschreibt häufige Verwendungszwecke für Webanwendungen und gibt ein einfaches Beispiel.

Häufige Verwendungszwecke für Webanwendungen

Webanwendungen haben viele Verwendungszwecke sowohl für Websitebesucher als auch für Entwickler, einschließlich der folgenden:

• Besuchern dabei helfen, Informationen schnell und einfach auf einer inhaltsreichen Website zu finden.

  Diese Art von Web-Anwendung gibt Besuchern die Möglichkeit, Inhalte nach ihren Wünschen zu suchen, zu organisieren und zu navigieren. Beispiele sind Firmen-Intranets, Microsoft MSDN (www.msdn.microsoft.com) und Amazon.com (www.amazon.com).

• Die von Besuchern der Site eingegebenen Daten können erfasst, gespeichert und analysiert werden.

  In der Vergangenheit wurden in HTML-Formularen eingegebene Daten als E-Mail-Nachrichten an Mitarbeiter oder CGI-Anwendungen zur Verarbeitung gesendet. Eine Web-Anwendung kann Formulardaten direkt in einer Datenbank speichern und auch die Daten extrahieren und Web-basierte Berichte zur Analyse erstellen. Beispiele sind Online-Banking-Seiten, Webstore-Checkout-Seiten, Surveys und User-Feedback-Formulare.

• Websites, deren Inhalt sich häufig ändert, können schneller aktualisiert werden.

  Eine Web-Anwendung befreit den Webdesigner von der kontinuierlichen Aktualisierung des HTML der Site. Content-Anbieter wie Nachrichtenredakteure versorgen die Web-Anwendung mit Inhalten, und die Web-Anwendung aktualisiert die Site automatisch. Beispiele sind der Economist (www.economist.com) und CNN (www.cnn.com).

Beispiel für eine Webanwendung

Janet ist eine professionelle Webdesignerin und langjährige Dreamweaver-Benutzerin, die für die Wartung der Intranet- und Internetseiten eines mittelgroßen Unternehmens mit 1000 Mitarbeitern verantwortlich ist.Eines Tages kommt Chris aus der Personalabteilung zu ihr mit einem Problem. Die Personalabteilung verwaltet ein Mitarbeiterfitnessprogramm, das Mitarbeitern Punkte für jeden gelaufenen, gefahrenen oder gejoggten Kilometer gibt.Jeder Mitarbeiter muss seine oder ihre monatlichen Kilometer-Gesamtwerte in einer E-Mail an Chris melden. Am Ende des Monats sammelt Chris alle E-Mail-Nachrichten und vergibt an Mitarbeiter kleine Geldpreise entsprechend ihrer Punktzahlen.

Das Problem ist nun, dass das Fitnessprogramm sich als durchschlagender Erfolg erwiesen hat. So viele Mitarbeiter nehmen jetzt teil, dass Chris am Ende jedes Monats von E-Mails überschwemmt wird. Chris fragt Janet, ob eine webbasierte Lösung existiert.

Janet schlägt eine Intranet-basierte Web-Anwendung vor, die folgende Aufgaben erfüllt:

• Mitarbeitern ermöglichen, ihre Kilometerleistung auf einer Web-Seite mit einem einfachen HTML-Formular einzugeben

• Die Kilometeranzahl der Mitarbeiter wird in einer Datenbank gespeichert.

• Die Fitnesspunkte werden auf Grundlage der Kilometeranzahl berechnet.

• Die Mitarbeiter können ihre monatliche Leistung verfolgen.

• Chris Zugriff mit einem Klick auf Punktzahlen am Ende jedes Monats geben

  Janet bringt die Anwendung vor dem Mittagessen mit Dreamweaver zum Laufen, das über die Tools verfügt, die sie benötigt, um diese Art von Anwendung schnell und einfach aufzubauen.

Funktionsweise einer Webanwendung

Eine Web-Anwendung ist eine Sammlung statischer und dynamischer Web-Seiten.Eine statische Web-Seite ist eine, die sich nicht ändert, wenn ein Site-Besucher sie anfordert: Der Webserver sendet die Seite an den anfordernden Browser, ohne sie zu ändern.Im Gegensatz dazu wird eine dynamische Web-Seite vom Server geändert, bevor sie an den anfordernden Browser gesendet wird.Dass sich die Seite verändert, ist der Grund, warum sie dynamisch genannt wird.

Du könntest beispielsweise eine Seite entwerfen, um Fitnessergebnisse anzuzeigen, während bestimmte Informationen (wie Mitarbeitername und Ergebnisse) erst bestimmt werden, wenn die Seite von einem bestimmten Mitarbeiter angefordert wird.

Die nächsten Abschnitte beschreiben ausführlicher, wie Webanwendungen funktionieren.

Statische Webseiten verarbeiten

Eine statische Website umfasst eine Reihe verwandter HTML-Seiten und Dateien, die auf einem Computer gehostet werden, auf dem ein Webserver läuft.

Ein Webserver ist Software, die Webseiten als Antwort auf Anfragen von Webbrowsern bereitstellt.Eine Seitenanfrage wird generiert, wenn ein Besucher auf einen Link auf einer Web-Seite klickt, ein Lesezeichen in einem Browser auswählt oder eine URL in die Adresszeile eines Browsers eingibt.

Der endgültige Inhalt einer statischen Web-Seite wird vom Seitendesigner bestimmt und ändert sich nicht, wenn die Seite angefordert wird.Hier ist ein Beispiel:

<html>

<head>

<title>Trio Motors Information Page</title>

</head>

<body>

<h1>About Trio Motors</h1>

<p>Trio Motors is a leading automobile manufacturer.</p>

</body>

</html>

Jede Zeile des HTML-Codes der Seite wird vom Designer geschrieben, bevor die Seite auf den Server gelegt wird.Da sich das HTML nicht ändert, sobald es auf dem Server ist, wird diese Art von Seite als statische Seite bezeichnet.

Genau genommen kann eine „statische“ Seite alles andere als statisch sein. Sie kann beispielsweise durch ein Rollover-Bild oder einen Flash-Inhalt (eine SWF-Datei) überaus lebendig wirken. In dieser Dokumentation wird eine Seite jedoch als statisch bezeichnet, wenn sie ohne Änderungen an den Browser gesendet wird.

Wenn der Webserver eine Anfrage für eine statische Seite erhält, liest der Server die Anfrage, findet die Seite und sendet sie an den anfordernden Browser, wie das folgende Beispiel zeigt:

Bei Webanwendungen sind bestimmte Codezeilen noch nicht festgelegt, wenn der Besucher die Seite anfordert.Diese Zeilen müssen durch einen Mechanismus bestimmt werden, bevor die Seite an den Browser gesendet werden kann. Der Mechanismus wird im folgenden Abschnitt erläutert.

Dynamische Seiten verarbeiten

Wenn ein Webserver eine Anforderung für eine statische Web-Seite erhält, sendet der Server die Seite direkt an den anfordernden Browser. Wenn der Webserver eine Anforderung für eine dynamische Seite erhält, reagiert er jedoch anders: Er übergibt die Seite an eine spezielle Software, die für die Fertigstellung der Seite verantwortlich ist. Diese Software wird als Anwendungsserver bezeichnet.

Der Anwendungsserver liest den Code auf der Seite, stellt die Seite gemäß den Anweisungen im Code fertig und entfernt dann den Code von der Seite. Das Ergebnis ist eine statische Seite, die der Anwendungsserver zurück an den Webserver übergibt, der dann die Seite an den anfordernden Browser sendet. Alles, was der Browser erhält, wenn die Seite geladen wird, ist reines HTML.Im Folgenden wird dieser Vorgang veranschaulicht:

Auf Datenbanken zugreifen

Ein Anwendungsserver ermöglicht es dir, mit Server-seitigen Ressourcen wie Datenbanken zu arbeiten. Zum Beispiel kann eine dynamische Seite den Anwendungsserver anweisen, Daten aus einer Datenbank zu extrahieren und sie in das HTML der Seite einzufügen. Weitere Informationen finden Sie unter www.adobe.com/go/learn_dw_dbguide.

Die Verwendung einer Datenbank zum Speichern von Inhalten ermöglicht es dir, das Design deiner Website von den Inhalten zu trennen, die du den Website-Nutzern anzeigen möchtest.Anstatt einzelne HTML-Dateien für jede Seite zu schreiben, musst du nur eine Seite—oder Vorlage—für die verschiedenen Arten von Informationen schreiben, die du präsentieren möchtest. Du kannst dann Inhalte in eine Datenbank hochladen und anschließend die Website diese Inhalte als Antwort auf eine Benutzeranfrage abrufen lassen.Du kannst auch Informationen in einer einzigen Quelle aktualisieren und dann diese Änderung auf der gesamten Website verbreiten, ohne jede Seite manuell bearbeiten zu müssen. Du kannst Adobe Dreamweaver verwenden, um Webformulare zu entwerfen, die Daten aus der Datenbank einfügen, aktualisieren oder löschen.

Die Anweisung zum Extrahieren von Daten aus einer Datenbank wird Datenbankabfrage genannt. Eine Abfrage besteht aus Suchkriterien, die in einer Datenbanksprache namens SQL (Structured Query Language) ausgedrückt werden. Die SQL-Abfrage wird in die serverseitigen Skripte oder Tags der Seite geschrieben.

Ein Anwendungsserver kann nicht direkt mit einer Datenbank kommunizieren, da das proprietäre Format der Datenbank die Daten unverständlich macht, genauso wie ein Microsoft Word-Dokument, das in Notepad oder BBEdit geöffnet wird, unverständlich sein kann. Der Anwendungsserver kann nur über einen Datenbanktreiber mit der Datenbank kommunizieren: Software, die wie ein Dolmetscher zwischen dem Anwendungsserver und der Datenbank fungiert.

Nachdem der Treiber die Kommunikation hergestellt hat, wird die Abfrage gegen die Datenbank ausgeführt und ein Recordset wird erstellt. Ein Recordset ist ein Satz von Daten, die aus einer oder mehreren Tabellen in einer Datenbank extrahiert wurden. Das Recordset wird an den Anwendungsserver zurückgegeben, der die Daten verwendet, um die Seite zu vervollständigen.

Das folgende Beispiel zeigt eine einfache, in SQL geschriebene Datenbankabfrage:

SELECT lastname, firstname, fitpoints

FROM employees

Diese Anweisung erstellt ein dreispaltiges Recordset und füllt es mit Zeilen, die den Nachnamen, Vornamen und die Fitnesspunkte aller Mitarbeiter in der Datenbank enthalten. Weitere Informationen finden Sie unter www.adobe.com/go/learn_dw_sqlprimer.

Das folgende Beispiel zeigt den Prozess der Abfrage einer Datenbank und der Rückgabe von Daten an den Browser:

Du kannst fast jede Datenbank mit deiner Web-Anwendung verwenden, solange der entsprechende Datenbanktreiber auf dem Server installiert ist.

Wenn du kleine kostengünstige Anwendungen aufbauen möchtest, kannst du eine dateibasierte Datenbank verwenden, wie zum Beispiel eine in Microsoft Access erstellte. Wenn du robuste, ausschlaggebende Anwendungen aufbauen möchtest, kannst du eine serverbasierte Datenbank verwenden, wie zum Beispiel eine in Microsoft SQL Server, Oracle 9i oder MySQL erstellte.

Wenn sich deine Datenbank auf einem anderen System als deinem Webserver befindet, stelle sicher, dass du eine schnelle Verbindung zwischen den beiden Systemen hast, damit deine Web-Anwendung schnell und effizient funktionieren kann.

Dynamische Seiten erstellen

Das Erstellen dynamischer Seiten geschieht in zwei Schritten: Zunächst muss der HTML-Code geschrieben werden und dann müssen dem HTML-Code die serverseitigen Skripts oder Tags hinzugefügt werden, um eine dynamische Seite zu erhalten. Im resultierenden Code ist die Programmiersprache im HTML-Code der Seite eingebettet. Daher werden diese Sprachen auch als HTML-eingebettete Programmiersprachen bezeichnet. Im folgenden Beispiel wird CFML (ColdFusion Markup Language) verwendet:

Hinweis: CFML-Unterstützung wurde in Dreamweaver und späteren Versionen entfernt.

<html>

<head>

<title>Trio Motors Informationsseite</title>

</head>

<body>

<h1>Über Trio Motors</h1>

<p>Trio Motors ist ein führender Automobilhersteller.</p>

<!--- eingebettete Anweisungen beginnen hier --->

<cfset department="Sales">

<cfoutput>

<p>Besuche unbedingt unsere #department# Seite.</p>

</cfoutput>

<!--- eingebettete Anweisungen enden hier --->

</body>

</html>

Die eingebetteten Anweisungen auf dieser Seite führen folgende Aktionen aus:

Der Anwendungsserver gibt folgende Seite an den Webserver zurück:

<html>

<head>

<title>Trio Motors Information Page</title>

</head>

<body>

<h1>About Trio Motors</h1>

<p>Trio Motors is a leading automobile manufacturer.</p>

<p>Be sure to visit our Sales page.</p>

</body>

</html>

Der Webserver sendet die Seite an den anfragenden Browser, der sie folgendermaßen anzeigt:

Über Trio Motors

Trio Motors ist ein führender Automobilhersteller.

Be sure to visit our Sales page.

Du wählst eine Scripting- oder Tag-basierte Sprache je nach Server-Technologie aus, die auf deinem Server verfügbar ist. Hier sind die gängigsten Sprachen für die Servertechnologien, die von Dreamweaver unterstützt werden:

Dreamweaver kann die Server-seitigen Skripte oder Tags erstellen, die notwendig sind, damit deine Seiten funktionieren, oder du kannst sie per Hand in der Dreamweaver-Codierungsumgebung schreiben.

Terminologie für Webanwendungen

Dieser Abschnitt definiert häufig verwendete Begriffe im Zusammenhang mit Web-Anwendungen.

Software, die einem Webserver hilft, Web-Seiten zu verarbeiten, die Server-seitige Skripte oder Tags enthalten. Wenn eine solche Seite vom Server angefordert wird, übergibt der Webserver die Seite zur Verarbeitung an den Anwendungs- server, bevor er die Seite an den Browser sendet. Für weitere Informationen siehe Wie eine Web-Anwendung funktioniert.

Gängige Anwendungsserver sind ColdFusion und PHP.

Eine Sammlung von Daten, die in Tabellen gespeichert sind. Jede Zeile einer Tabelle stellt einen Datensatz dar und jede Spalte stellt ein Feld im Datensatz dar, wie im folgenden Beispiel gezeigt:

Software, die als Interpreter zwischen einer Web-Anwendung und einer Datenbank fungiert. Daten in einer Datenbank werden in einem proprietären Format gespeichert. Ein Datenbanktreiber ermöglicht es der Web-Anwendung, Daten zu lesen und zu bearbeiten, die sonst nicht entschlüsselbar wären.

(DBMS oder Datenbanksystem) Software, die zum Anlegen und Bearbeiten von Datenbanken verwendet wird. Häufige Datenbanksysteme sind Microsoft Access, Oracle 9i und MySQL.

ist ein Vorgang, bei dem eine Datensatzgruppe aus einer Datenbank extrahiert wird. Eine Abfrage besteht aus Suchkriterien, die in einer Datenbanksprache namens SQL ausgedrückt werden. Die Abfrage kann beispielsweise festlegen, dass nur bestimmte Spalten oder nur bestimmte Datensätze in das Recordset aufgenommen werden.

Eine Web-Seite, die von einem Anwendungsserver angepasst wird, bevor die Seite an einen Browser gesendet wird.

Eine Gruppe von Daten, die aus einer oder mehreren Tabellen einer Datenbank extrahiert wurden, wie im folgenden Beispiel:

Eine Datenbank, die mehr als eine Tabelle enthält, wobei die Tabellen gemeinsame Daten verwenden.Die folgende Datenbank ist relational, weil zwei Tabellen die Spalte DepartmentID teilen.

Die Technologie, die ein Anwendungsserver verwendet, um dynamische Seiten zur Laufzeit zu ändern.

Die Dreamweaver-Entwicklungsumgebung unterstützt die folgenden Servertechnologien:

• Adobe® ColdFusion®

• Microsoft Active Server Pages (ASP)

• PHP: Hypertext Preprocessor (PHP)

  Du kannst auch die Dreamweaver-Programmierumgebung verwenden, um Seiten für andere hier nicht aufgeführte Servertechnologien zu entwickeln.

Eine Web-Seite, die nicht von einem Anwendungsserver geändert wird, bevor die Seite an einen Browser gesendet wird. Weitere Informationen findest du unter Verarbeitung statischer Web-Seiten.

Eine Website, die Seiten mit teilweise oder vollständig unbestimmtem Inhalt enthält. Der endgültige Inhalt dieser Seiten wird erst bestimmt, wenn ein Besucher eine Seite vom Webserver anfordert. Da der endgültige Inhalt der Seite je nach Anfrage basierend auf den Aktionen des Besuchers variiert, wird diese Art von Seite als dynamische Seite bezeichnet.

Software, die Webseiten als Antwort auf Anfragen von Webbrowsern bereitstellt.Eine Seitenanfrage wird generiert, wenn ein Besucher auf einen Link auf einer Web-Seite im Browser klickt, ein Lesezeichen im Browser auswählt oder eine URL in die Adressleiste des Browsers eingibt.

Beliebte Webserver sind Microsoft Internet Information Server (IIS) und Apache HTTP Server.

Ähnliche Themen

• Einführung in Datenbanken
• Applikations-Server auswählen