Commit 3803869a authored by Axel Dürkop's avatar Axel Dürkop

Update Content neue Sitzung

parent e434ddc9
......@@ -36,7 +36,10 @@
* [[06] 2017-05-22](sitzungen/06-Mo-2017-05-22.md)
* [Arbeitsauftrag INF1](sitzungen/auftraege/06-Mo-2017-05-22-auftrag-inf1.md)
* [Arbeitsauftrag INF2](sitzungen/auftraege/06-Mo-2017-05-22-auftrag-inf2.md)
* [[07] 2017-05-29](sitzungen/07-Mo-2017-05-29.md)
* [Arbeitsauftrag INF1](sitzungen/auftraege/07-Mo-2017-05-29-auftrag-inf1.md)
* [Arbeitsauftrag INF2](sitzungen/auftraege/07-Mo-2017-05-29-auftrag-inf2.md)
## Lernmaterialtypen
* [Lernmaterialtypen](material/typen/einleitung.md)
* [Bücher](material/typen/buecher.md)
......@@ -49,16 +52,16 @@
* [Referenzen](material/typen/referenzen.md)
## Sitzungsmaterial
* [Studienleistungen mit GitLab hochladen](material/sitzungsmaterial/studienleistungen-in-gitlab-hochladen.md)
* [Experiment: Client-/Serverkommunikation](material/sitzungsmaterial/analyse-client-server.md)
* [Sechszeiler in Markdown](material/sitzungsmaterial/sechszeiler-in-markdown.md)
* [Einrichtung Raspberry Pi](material/sitzungsmaterial/einrichtung-rpi.md)
* [Linux-Quickstart](material/sitzungsmaterial/linux.md)
* [Dateitransfer mit FileZilla](material/sitzungsmaterial/filezilla.md)
* [Flask auf der Serverseite](material/sitzungsmaterial/flask/flask-auf-der-serverseite.md)
* [Request-Daten mit Flask auswerten](material/sitzungsmaterial/flask/request-daten-mit-flask-auswerten.md)
* [Aus statisch mach dynamisch](material/sitzungsmaterial/flask/aus-statisch-mach-dynamisch.md)
* [Installation von remote-sync](material/sitzungsmaterial/flask/installation-von-remote-sync.md)
* [Studienleistungen mit GitLab hochladen](material/sitzungsmaterial/studienleistungen-in-gitlab-hochladen.md)
* [Experiment: Client-/Serverkommunikation](material/sitzungsmaterial/analyse-client-server.md)
* [Sechszeiler in Markdown](material/sitzungsmaterial/sechszeiler-in-markdown.md)
* [Einrichtung Raspberry Pi](material/sitzungsmaterial/einrichtung-rpi.md)
* [Linux-Quickstart](material/sitzungsmaterial/linux.md)
* [Dateitransfer mit FileZilla](material/sitzungsmaterial/filezilla.md)
* [Flask auf der Serverseite](material/sitzungsmaterial/flask/flask-auf-der-serverseite.md)
* [Request-Daten mit Flask auswerten](material/sitzungsmaterial/flask/request-daten-mit-flask-auswerten.md)
* [Aus statisch mach dynamisch](material/sitzungsmaterial/flask/aus-statisch-mach-dynamisch.md)
* [Installation von remote-sync](material/sitzungsmaterial/flask/installation-von-remote-sync.md)
## Referenzen
* [Literatur](material/literatur.md)
......@@ -69,3 +72,4 @@
## Meta
* [Impressum und Kontakt](meta/impressum.md)
# [07] Montag, 29. Mai 2017
In der heutigen Sitzung werden wir eine statische HTML-Seite in eine dynamische verwandeln. Dazu verwenden wir das Python-Framework Flask.
## Ziele
- Sie kennen die Aufgaben von Flask und können vergleichbare Webframeworks nennen.
- INF2: Sie können den HTTP-Serverroundtrip anhand einer Viewfunktion in Flask erklären.
- INF2: Sie können ein statisches HTML-Konstrukt mithilfe von Flask zu einem dynamischen umbauen und über einen Entwicklungsserver ausliefern.
- INF1: Sie können mithilfe der Chrome-Developer-Tools eine reaktionsfähige Website aufbauen.
- INF1: Sie können Funktion und Bedeutung von *Media Queries* für reaktionsfähige Webseiten erklären.
## Geplante Inhalte und Ablauf
1. Feedback zu den Arbeitsaufträgen
1. Referat: Lernmaterialtyp "Blog" am Beispiel von Webseitennavigationen
1. INF1: Identifizierung von Darstellungsunterschieden bei reaktionsfähigen Webseiten (Gruppenarbeit)
1. INF2: Dynamisierung einer statischen Website mit Flask
## Aufgaben in der Sitzung
### INF1
1. Melden Sie sich per SSH auf dem Raspberry an.
1. Stellen Sie Ihre mobile Seite auf dem Raspberry bereit. Schicken Sie die Adresse über Mattermost an die anderen Teilnehmenden.
1. Untersuchen Sie die folgenden Webseiten mithilfe der Chrome-Developer-Tools auf Darstellungsunterschiede, wenn sich die Größe des Viewports ändert. Tragen Sie Ihre Erkenntnisse [in einem Etherpad](https://pads.rz.tuhh.de/p/darstellungsunterschiede-responsive) zusammen.
- [Starbucks](https://www.starbucks.com/)
- [Foodsense](http://foodsense.is/)
- [The Guardian](https://www.theguardian.com/)
### INF2
Der Umbau der Website *Secondhandblumen Petersen* von statisch zu dynamisch erfolgt unter Anleitung des Dozenten.
## Auftrag für INF1 zu [08], 2017-06-12
### Ziele
- Sie können wesentliche Unterschiede in der Darstellung von reaktionsfähigen Webseiten implementieren.
### Inhalte und Aufgaben des Auftrags
- Arbeiten Sie weiter an Ihrer mobilen Website. Entscheiden Sie sich vorher für ein klares und greifbares Thema der Seite ("Tierheim", "Ruderverein", "Fußballclub").
- Legen Sie mindestens einen *breakpoint* fest, an dem der Wechsel zu einer mobilen Ansicht sichtbar wird.
- Versuchen Sie sich an einer Navigation mit "Bürgermenü". Das Netz hält eine Reihe von Tutorials dazu bereit. Wählen Sie eines, das ohne JavaScript auskommt.
- Achten Sie darauf, dass Ihre Seite keine Rechte verletzt, und stellen Sie sie wieder auf Uberspace online.
- Teilen Sie den Link in Mattermost.
- Stellen Sie zusätzlich das Ergebnis in GitLab bereit. Legen Sie dazu in Ihrem Projekt einen neuen Ordner *mobile_seite* an.
### Abgabetermin
* Geben Sie möglichst früh eine erste Version ab. Sie erhalten dann Feedback zu Ihrer Arbeit.
* Geben Sie die finale Version am **Sonntag, den 11.06.2017**, ab.
**Wichtig!** Die Abgabe erfolgt bitte **nicht mehr per Mail**, sondern wie [in der Anleitung "Studienleistungen in GitLab hochladen"](/material/sitzungsmaterial/studienleistungen-in-gitlab-hochladen.md) beschrieben. Nur so kann das Dozententeam detailliertes und konstruktives Feedback an Ihrem Text leisten!
## Auftrag für INF2 zu [08], 2017-06-12
### Ziele
- Sie haben Ihre Projektwebsite zu einer dynamischen Flaskanwendung umgebaut.
### Inhalte und Aufgaben des Auftrags
1. Klonen Sie Ihr Webseitenprojekt von GitLab auf den Raspberry Pi.
1. Verfahren Sie wie in der Veranstaltung mit der Website *Secondhandblumen Petersen*. Ziel: Alle Ansichten werden unter eigenen Routen angezeigt.
1. Stellen Sie den kompletten Quellcode des Auftrags in einem neuen Unterordner *flask_01* in GitLab bereit.
### Abgabetermin
* Geben Sie möglichst früh eine erste Version ab. Sie erhalten dann Feedback zu Ihrer Arbeit.
* Geben Sie die finale Version am **Sonntag, den 11.06.2017**, ab.
**Wichtig!** Die Abgabe erfolgt bitte **nicht mehr per Mail**, sondern wie [in der Anleitung "Studienleistungen in GitLab hochladen"](/material/sitzungsmaterial/studienleistungen-in-gitlab-hochladen.md) beschrieben. Nur so kann das Dozententeam detailliertes und konstruktives Feedback an Ihrem Text leisten!
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment