03-fr-2021-10-29.md 5.42 KB
Newer Older
Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
1 2
---
title: 03 | Freitag, 29.10.2021
Axel Dürkop's avatar
Axel Dürkop committed
3
date: 2021-10-29T08:50:13.000Z
Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
4 5 6
draft: false
type: book
toc: true
Axel Dürkop's avatar
Axel Dürkop committed
7
summary: Besprechen des Arbeitsauftrags zum Schreiben, Checken der Arbeitsumgebung auf den eigenen Rechnern, erste Schritte mit HTML und CSS.
Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
8 9
---

Axel Dürkop's avatar
Axel Dürkop committed
10 11 12 13
## Ziele

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

Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
## 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](https://t3n.de/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](https://beakerbrowser.com/) für erste Schritte mit HTML, CSS und JavaScript. So können wir "klassisch" mit dem Protokoll [HTTP](https://de.wikipedia.org/wiki/Hypertext_Transfer_Protocol) 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](https://hypercore-protocol.org/) teilen.

In der heutigen Sitzung probieren wir gemeinsam aus, was es heißt, ein [Peer-to-peer-Netzwerk](https://www.heise.de/tipps-tricks/Peer-to-Peer-was-ist-das-4660681.html) mit dem Beaker Browser aufzubauen und erste HTML-Inhalte zu erstellen.

{{% notice aufgabe "Erste Schritte mit dem Beaker Browser" %}}
1. [Installieren Sie den Beaker Browser](https://beakerbrowser.com/install/).
2. Schauen Sie sich [die Lerneinheit "OER mit dem Beaker Browser entwickeln und teilen"](../../../../einheiten/beaker-browser/) an.
3. Erstellen Sie eine einfache HTML-Seite im Beaker Browser.
4. Teilen Sie den Link zu Ihrem Hyperdrive mit anderen.
{{% /notice %}}

Axel Dürkop's avatar
Axel Dürkop committed
35 36 37 38
### 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.

39
[Video "Reflexion zum Einsatz von Beaker Browser in der Lehre" auf Vimeo ansehen](https://player.vimeo.com/video/641065434?h=1eba445c6d)
Axel Dürkop's avatar
Axel Dürkop committed
40

Axel Dürkop's avatar
Axel Dürkop committed
41 42 43 44 45 46 47 48
## Links aus der Veranstaltung

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

- [Analyse: Facebook heißt jetzt Meta](https://www.augsburger-allgemeine.de/wirtschaft/Facebook-Neuer-Name-Meta-Gruende-fuer-die-Namensaenderung-id60901206.html)
- ["The Metaverse Primer" von Matthew Ball](https://www.matthewball.vc/the-metaverse-primer) Es ist offensichtlich, dass die Vision von Matthew Ball zum Metaversum auf Facebook inspirierend gewirkt hat.
- [Audio: SciFi-Roman "Snow Crash" in neuer Übersetzung erschienen](http://larsschmeink.de/?p=4799) Mein lieber Kollege Lars Schmeink, seines Zeichens Science-Fiction-Experte, hat dem DLF Kultur ein kurzes Interview zur neuen Übersetzung von "Snow Crash" gegeben. Darin gibt es auch ein Metaverse.

Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
49 50
## Auftrag

Axel Dürkop's avatar
Axel Dürkop committed
51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71
### Arbeit an der Projektskizze

{{% notice aufgabe "Aktueller Stand der Projektidee" %}}
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. 
6. Tragen Sie als Kanalüberschrift den Link zum Ihrem Pad ein.
5. Informieren Sie die Gruppe im Town Square darüber.
{{% /notice %}}

### 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.

{{% notice aufgabe "Ein erste HTML-Seite" %}}
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.
Axel Dürkop's avatar
Axel Dürkop committed
72
4. Versuchen Sie sich an der Einheit [Einführung in HTML und CSS](../../../../einheiten/html-und-css/einfuehrung/). **Wichtig:** Wandeln Sie bei der Bearbeitung der Lerneinheit gern das Mockup so ab, dass es Ihrer Projektidee entgegenkommt.
Axel Dürkop's avatar
Axel Dürkop committed
73 74
5. Tragen Sie die Adresse zu Ihrer Website in unserem gemeinsamen HedgeDoc ein. Den Link dafür finden Sie im Town Square von Mattermost.
{{% /notice %}}
Axel Dürkop's avatar
Add 03  
Axel Dürkop committed
75 76 77

### Abgabe

Axel Dürkop's avatar
Axel Dürkop committed
78
Der Auftrag ist bis **Donnerstag, 04.11.2021**, zu erledigen.