| Allgemeine Informationen |
Didaktische Vorüberlegungen |
|
|
| HTML |
Auszeichnungen (tags) |
HTML-Elemente werden mit "tags" ausgezeichnet. |
|
Allgemeine Struktur von HTML-Dokumenten |
HTML-Seiten werden in Kopf <head> und Körper <body> unterteilt. |
|
Links (ausführbare Verweise) |
Mit ausführbaren Verweisen wird zu anderen Seiten navigiert. |
|
Graphikdateien einbinden |
Mit dem img-Tag werden Graphikdateien im Browser angezeigt. |
|
Absolute und relative Pfadangaben |
Pfadangaben können absolut und relativ sein. |
|
HTML5 |
|
|
| CSS |
CSS - Selektoren |
Mit CSS-Selektoren wird ausgewählt, welchen HTML-Elementen ein bestimmtes Design zugewiesen wird: |
|
CSS auf HTML-Seite anwenden |
Es gibt mehrere Möglichkeiten CSS-Anweisungen auf HTML-Seiten anzuwenden. |
|
Lösung: CSS |
|
|
| JavaScript |
Client- und serverseitiges JavaScript |
|
|
"Hello World" mit JavaScript im Browser |
|
|
JavaScript in aller Kürze |
|
|
Lösung: JS interagiert mit HTML (Animation der Seite) |
|
|
Lösung: JS lädt JSON-Daten in die Webseite |
|
|
Lösung: JSON vs. XML |
|
|
| Dynamische Webseiten |
Exkurs: Webserver |
|
|
Statische versus dynamische Webseiten |
Dynamische Webseiten werden serverseitig verändert, bevor Sie dem Browser ausgeliefert werden. |
|
| Microservices |
Microservices und monolithische Architektur |
|
|
Lösung: Vor- und Nachteile der Microservices-Architektur |
|
|
RESTful API |
|
|
OpenAPI |
|
|
| Python Webframework: Flask |
Flask vs. Bottle vs. Django |
|
|
Lösung: GET mit Flask |
|
|
Lösung: POST mit Flask |
|
|
| Mikroservice zur Authentifizierung/Autorisierung |
Authentifizierung und Autorisierung |
|
|
Einfache token-basierte Authentifizierung mit Session-ID |
|
|
Lösung: Dummy eines Microservice zur Authentifizierung |
|
|
Vorbereitung MySQL- bzw. MariaDB-Server |
|
|
MySQL- bzw. MariaDB-Anbindung mit Python3 |
|
|
Lösung: SimpleAuthService mit Datenbank |
|
|
Exkurs: Salted (and peppered) Hashing |
|
|
Lösungsvorschlag: einfache token-basierte Webanwendung |
|
|
Exkurs: Web Fonts |
|
|
Lösungsvorschlag: JWT-basierte Webanwendung |
|
|
Exkurs: JSON Web Token |
|
|
Lösungsvorschlag: Anmeldung mit Google-Konto |
|
|
Exkurs: OAuth2 und OpenID Connect |
|
|
Lösungsvorschlag: 2FA mit TOTP |
|
|
Exkurs: 2FA und TOTP |
|
|
| Hilfsfunktionen |
Python Virtual Environment |
|
|
| Passkey |
Lösungsvorschlag: Passkey |
|
|
Exkurs: Passkey |
|