03 | Freitag, 29.10.2021

Ziele

  • Sie bauen HTML-Dokumente mithilfe einfacher Editoren und/oder dem Beaker Browser.

Architekturen des Webs

In der heutigen Sitzung nähern wir uns praktisch der Funktionsweise des Internets an. Aber so einfach, wie ich das hier hinschreibe, ist es nicht. “Das Internet” ist wie eine Megacity mit unterschiedlichen Stadtteilen, Verkehrsmitteln, Gepflogenheiten, Geschmäckern und Architekturen. Denken Sie bspw. an Hamburg, wo es den historisch gewachsenen Stadtkern gibt und die Hafencity, die in wenigen Jahren entstanden ist.

Und unpräzise ist “das Internet” außerdem, denn der Teil, der uns in dieser Veranstaltung interessiert, ist das World Wide Web (WWW) und sein möglicher Nachfolger, das sogenannte web3.

In den Projekten, an denen Sie arbeiten werden, werden die Client-/Serverstrukturen des WWW immer wieder auftauchen und Gegenstand unserer Auseinandersetzung mit verschiedenen Konzepten sein. Denn nur, weil es jetzt auch das web3 gibt, sind die dreißig Jahre alten Strukturen des World Wide Web nicht einfach verschwunden oder schlecht.

Einstieg in das dezentrale Web mit dem Beaker Browser

Um das beste aus beiden Welten, also World Wide Web und web3, kennenzulernen, verwenden wir den Beaker Browser für erste Schritte mit HTML, CSS und JavaScript. So können wir “klassisch” mit dem Protokoll HTTP Websites von Servern aufrufen (WWW), aber auch Websites direkt im Browser (!) entwickeln und hosten, die wir in einem Peer-to-peer-Netzwerk über das Protokoll Hypercore teilen.

In der heutigen Sitzung probieren wir gemeinsam aus, was es heißt, ein Peer-to-peer-Netzwerk mit dem Beaker Browser aufzubauen und erste HTML-Inhalte zu erstellen.

  1. Installieren Sie den Beaker Browser.
  2. Schauen Sie sich die Lerneinheit “OER mit dem Beaker Browser entwickeln und teilen” an.
  3. Erstellen Sie eine einfache HTML-Seite im Beaker Browser.
  4. Teilen Sie den Link zu Ihrem Hyperdrive mit anderen.

Video: Reflexion (I) zum Einsatz in der Lehre

Der Beaker Browser hat den Einsatz in einer Gruppe von zwanzig Personen gut bestanden. In diesem Video möchte ich unser didaktisches Setting kurz skizzieren und von unseren Erfahrungen berichten.

Video “Reflexion zum Einsatz von Beaker Browser in der Lehre” auf Vimeo ansehen

Wir haben in Veranstaltung noch einige Themen gestreift, die ich hier noch einmal verlinken möchte:

Auftrag

Arbeit an der Projektskizze

  1. Tauschen Sie sich in Ihrer Projektgruppe weiter aus, um Ihre Projektidee zu schärfen.
  2. Unterhalten Sie sich auch mit anderen Projektgruppen, um Schnittmengen von Themen und erforderlichen Kompetenzen herauszufinden. Sie können sich nämlich auch gruppenübergreifend unterstützen.
  3. Überarbeiten Sie Ihr HedgeDoc-Dokument, wobei Sie auch folgende Fragen individuell beantworten:
    • Was ist mein persönliches Erkenntnisinteresse in dem Projekt?
    • Was will ich am Ende können?
  4. Falls noch nicht geschehen, legen Sie in Mattermost einen neuen öffentlichen Kanal mit dem Arbeitstitel des Projekts an.
  5. Tragen Sie als Kanalüberschrift den Link zum Ihrem Pad ein.
  6. Informieren Sie die Gruppe im Town Square darüber.

Eine erste HTML-Seite

In der Veranstaltung haben wir ausprobiert, wie im Beaker Browser neue Dateien angelegt werden können. Nun geht es darum, ein erstes Webseitenkonstrukt in Angriff zu nehmen.

  1. Erstellen Sie im Beaker Browser einen neuen Hyperdrive. Der Name sollte wieder Ihren Vornamen enthalten.
  2. Legen Sie eine Datei mit Namen index.html an.
  3. Legen Sie eine Datei mit Namen style.css an.
  4. Versuchen Sie sich an der Einheit Einführung in HTML und CSS. Wichtig: Wandeln Sie bei der Bearbeitung der Lerneinheit gern das Mockup so ab, dass es Ihrer Projektidee entgegenkommt.
  5. Tragen Sie die Adresse zu Ihrer Website in unserem gemeinsamen HedgeDoc ein. Den Link dafür finden Sie im Town Square von Mattermost.

Abgabe

Der Auftrag ist bis Donnerstag, 04.11.2021, zu erledigen.

Zurück
Weiter