Informatik · Klasse 12

Ideen für aktives Lernen

Client-Server-Architekturen und Web-Anwendungen

Aktive Lernformen eignen sich besonders gut, um Client-Server-Architekturen zu verstehen, weil Schülerinnen und Schüler die abstrakten Kommunikationsprozesse durch eigenes Handeln begreifen. Durch das Erleben von Request-Response-Zyklen als Entwickler oder Nutzer verankern sie das Wissen nachhaltig, da sie die Konsequenzen ihrer Code-Entscheidungen direkt sehen und reflektieren können.

• KMK Bildungsstandards
• KMK: Sekundarstufe II - Modellieren und Implementieren
• KMK: Sekundarstufe II - Strukturieren und Vernetzen

• 30–50 Min.
• Partnerarbeit → Ganze Klasse
• 4 Aktivitäten

Aktivität 01

• Projektbasiertes Lernen
• 45 Min. · Partnerarbeit

Pair Programming: Einfache Chat-App

Paare entwickeln eine Client-Server-Chat-Anwendung mit HTML, JavaScript und Node.js. Der Client sendet Nachrichten per Fetch-API, der Server speichert und antwortet. Testen Sie den Austausch live und protokollieren Sie den Datenfluss.

Wie wird eine Anfrage im Browser bis zum Server und zurück verarbeitet?

Moderationstipp

Legen Sie während der Pair-Programming-Aktivität klare Zeitvorgaben fest, z. B. 20 Minuten pro Rolle, damit beide Partner die Perspektive des Clients und Servers aktiv erleben.

Worauf zu achten ist

Stellen Sie den Schülern ein einfaches Szenario vor (z. B. 'Ein Nutzer klickt auf 'Artikel in den Warenkorb legen''). Bitten Sie sie, auf einem Blatt Papier die wichtigsten Schritte der Kommunikation zwischen Client und Server zu skizzieren und die beteiligten Protokolle zu benennen.

• Anwenden
• Analysieren
• Bewerten
• Erschaffen
• Selbststeuerung
• Beziehungsfähigkeit
• Entscheidungsfähigkeit

Aktivität 02

• Projektbasiertes Lernen
• 50 Min. · Kleingruppen

Stationsrotation: HTTP-Simulation

Richten Sie Stationen ein: Browser-Anfrage schreiben, Server-Antwort parsen, Fehler simulieren, Caching demonstrieren. Gruppen rotieren alle 10 Minuten, notieren Beobachtungen und diskutieren Unterschiede.

Welche Aufgaben sollten auf dem Client und welche auf dem Server ausgeführt werden?

Moderationstipp

Stellen Sie für die Stationsrotation vorbereitete HTTP-Header-Karten bereit, damit die Schüler die Simulation ohne technische Hürden beginnen können.

Worauf zu achten ist

Leiten Sie eine Diskussion mit der Frage: 'Welche Art von Datenverarbeitung sollte Ihrer Meinung nach idealerweise auf dem Client stattfinden und warum? Geben Sie konkrete Beispiele.' Fordern Sie die Schüler auf, ihre Antworten mit den Prinzipien der Client-Server-Aufgabenteilung zu begründen.

• Anwenden
• Analysieren
• Bewerten
• Erschaffen
• Selbststeuerung
• Beziehungsfähigkeit
• Entscheidungsfähigkeit

Aktivität 03

• Rollenspiel
• 30 Min. · Ganze Klasse

Rollenspiel: Request-Response-Kette

Die Klasse simuliert eine Web-Anfrage: Einige sind Browser, andere Router, Server, Datenbank. Schauspielen Sie den vollen Ablauf inklusive Fehlerfällen, dann modellieren Sie es diagrammatisch.

Entwerfen Sie eine einfache Client-Server-Anwendung und erklären Sie die Interaktion.

Moderationstipp

Weisen Sie im Rollenspiel jedem Schüler eine konkrete Rolle mit festen Aufgaben zu, z. B. 'Browser', 'DNS-Server' oder 'Datenbank', um die Komplexität handhabbar zu halten.

Worauf zu achten ist

Geben Sie jedem Schüler eine Karte mit einem Begriff (z. B. 'HTTP Request', 'Server-Datenbankabfrage', 'Client-Rendering'). Die Schüler sollen eine kurze Erklärung schreiben, was dieser Begriff im Kontext einer Webanwendung bedeutet und welche Rolle er spielt.

• Anwenden
• Analysieren
• Bewerten
• Sozialbewusstsein
• Selbstwahrnehmung

Aktivität 04

• Fallstudienanalyse
• 35 Min. · Einzelarbeit

Fallstudienanalyse: Web-Proxy bauen

Individuell erweitern Schüler eine gegebene Client-App um einen Proxy-Server mit Express.js. Senden Sie Requests darüber, messen Latenz und vergleichen mit direktem Zugriff.

Wie wird eine Anfrage im Browser bis zum Server und zurück verarbeitet?

Worauf zu achten ist

Stellen Sie den Schülern ein einfaches Szenario vor (z. B. 'Ein Nutzer klickt auf 'Artikel in den Warenkorb legen''). Bitten Sie sie, auf einem Blatt Papier die wichtigsten Schritte der Kommunikation zwischen Client und Server zu skizzieren und die beteiligten Protokolle zu benennen.

• Analysieren
• Bewerten
• Erschaffen
• Entscheidungsfähigkeit
• Selbststeuerung

Einige Hinweise zum Unterrichten dieser Einheit

Erfahrene Lehrkräfte setzen auf eine Kombination aus Hands-on-Erfahrung und Reflexion, um die abstrakte Architektur greifbar zu machen. Vermeiden Sie reine Frontalunterrichtung, da die dynamischen Prozesse zwischen Client und Server erst durch eigenes Handeln verstanden werden. Nutzen Sie analoge Methoden wie Rollenspiele, bevor Sie in die Programmierung einsteigen, um die Grundlagen zu legen. Forschung zeigt, dass Schülerinnen und Schüler technische Konzepte besser behalten, wenn sie sie aus einer Nutzerperspektive erleben und anschließend implementieren.

Am Ende dieses Activity Hubs können die Schülerinnen und Schüler die Rollen von Client und Server klar unterscheiden und die HTTP-Kommunikation in einer Webanwendung nachvollziehen. Sie begründen, warum bestimmte Aufgaben auf welcher Seite ausgeführt werden und können einfache Anwendungen mit dieser Architektur entwerfen. Erfolg zeigt sich in der Fähigkeit, Kommunikationsabläufe zu skizzieren und technischen Entscheidungen zu verteidigen.

---

Vorsicht vor diesen Fehlvorstellungen

• Während der Pair-Programming-Aktivität zur Chat-App könnte die Beobachtung auftreten, dass Schüler annehmen, alle Berechnungen laufen nur auf dem Client.

  Fordern Sie die Schüler auf, gezielt Datenbankoperationen auf dem Server zu implementieren und die Latenz zwischen clientseitiger und serverseitiger Verarbeitung zu messen. Lassen Sie sie dokumentieren, warum bestimmte Aufgaben nicht auf dem Client ausgeführt werden sollen.

• Während des Rollenspiels zur Request-Response-Kette könnte der Irrtum entstehen, der Server speichere den Client-Zustand automatisch.

  Nutzen Sie das Rollenspiel, um explizit Sessions oder Tokens einzuführen. Lassen Sie die Schüler den Ablauf nachstellen und beobachten, wie ohne diese Mechanismen keine Persistenz entsteht. Dokumentieren Sie dies in einem Protokoll.

• Während der Stationsrotation zur HTTP-Simulation könnte der Eindruck entstehen, Client und Server kommunizieren direkt ohne Protokoll.

  Lassen Sie die Schüler die simulierten HTTP-Header und Statuscodes analysieren und vergleichen, wie diese die Kommunikation strukturieren. Diskutieren Sie, warum Protokolle wie HTTP notwendig sind, um Missverständnisse zu vermeiden.

---

In dieser Übersicht verwendete Methoden

• Projektbasiertes Lernen
• Rollenspiel
• Fallstudienanalyse