diff --git a/docs/dhbw-lernziele.md b/docs/dhbw-lernziele.md new file mode 100644 index 0000000..51acc25 --- /dev/null +++ b/docs/dhbw-lernziele.md @@ -0,0 +1,146 @@ +# DHBW Technik I — Operative Lernziele (Vorschlag, zur Diskussion) + +**Status:** Vorschlag, *nicht gelockt*. Du redigierst. +**Basis:** DHBW-Fundament (3 Meta-Lernziele aus `dhbw-fundament.md`) + Prüfungsleistung-Kompetenzen (`dhbw-pruefungsleistung.md`). +**Eichmaß:** Fließsatz, default Bloom *Verstehen*, mit Praxis-Phasen-Anker. + +## Übergreifend (gilt für alle 8 Kapitel) + +Jedes Kapitel sollte mindestens *eines* der drei DHBW-Meta-Lernziele bedienen: +1. Industrie-Anschluss-Fähigkeit (Tools, Stack, Konventionen) +2. Selbstständig-Lernen-Lernen (Doku lesen, Errors googeln) +3. Theorie-Praxis-Verbindung (Anwendungsfall in Unternehmens-Kontext) + +## Kapitel 1 — Web Engineering Grundlagen + +*Aktuell 1791 Zeilen — zu groß. Vorschlag: in 2 Teilkapitel splitten, oder stark reduzieren.* + +### Lernziele + +**1.1** Die Studierenden können den **Browser-Render-Ablauf** (URL → DNS → TCP/TLS → HTTP → HTML-Parsing → CSS+JS → Pixel) frei reproduzieren. + +**1.2** Die Studierenden können **semantisches HTML** schreiben (header, nav, main, section, article, footer, label/input/button) und begründen, warum es für SEO + A11y wichtig ist. + +**1.3** Die Studierenden können **A11y-Basis-Standards** (BFSG/EAA ab 28.06.2025, WCAG POUR, semantisches HTML, ARIA als Ergänzung) anwenden und ein Minimum-Lighthouse-A11y-Audit durchführen. + +**1.4** Die Studierenden können einen lokalen **Dev-Server** einrichten (mit `python -m http.server` oder Live-Server-Extension) und sind mit Browser-DevTools (Elements, Console, Network, Performance, Lighthouse) vertraut. + +**1.5** Die Studierenden kennen die heutige **Tool-Landschaft** (Editor: VS Code, Build-Tools: Vite/Webpack, Frameworks: React/Vue/Svelte/Astro) und können *eine* davon als „erste Wahl" begründen. + +## Kapitel 2 — CSS Extended + +### Lernziele + +**2.1** Die Studierenden können das **Box-Model** (content/padding/border/margin) anwenden und mit `box-sizing: border-box` als Default arbeiten. + +**2.2** Die Studierenden können **Flexbox-Layouts** schreiben (display: flex, flex-direction, justify-content, align-items, flex-wrap, gap) für 1D-Strukturen. + +**2.3** Die Studierenden können **Grid-Layouts** schreiben (display: grid, grid-template-columns/rows, gap, areas) für 2D-Strukturen. + +**2.4** Die Studierenden können **Responsive Design** mit Media Queries (mobile-first) umsetzen. + +**2.5** Die Studierenden können **CSS-Animations + Transitions** verwenden — und wissen, wann *nicht* (Reduced Motion, Performance). + +## Kapitel 3 — Node.js Basics + +### Lernziele + +**3.1** Die Studierenden verstehen die **Rolle von Node.js** — JavaScript-Runtime außerhalb des Browsers (Server, CLI-Tools, Build-Skripte). + +**3.2** Die Studierenden können ein **Node-Projekt initialisieren** (`npm init`, package.json verstehen, dependencies hinzufügen) und kennen den **Versions-Knoten 24 LTS** (oder aktuell). + +**3.3** Die Studierenden können **ESM-Module** (import/export) schreiben — und kennen die Unterschiede zu CommonJS. + +**3.4** Die Studierenden können einen **HTTP-Server** mit `node:http` oder Express erstellen, der REST-Endpunkte bereitstellt. + +**3.5** Die Studierenden können mit **fetch** in Node (oder einer HTTP-Library) Daten von externen APIs holen. + +## Kapitel 4 — Node.js Advanced + +### Lernziele + +**4.1** Die Studierenden können **async/await + Promise** korrekt anwenden — verstehen den Unterschied zwischen sequentiell und parallel ausführen. + +**4.2** Die Studierenden können mit **Datei-System (fs/promises)** lesen + schreiben. + +**4.3** Die Studierenden können mit **Datenbanken** (mind. SQLite oder PostgreSQL via Knex/Drizzle) CRUD-Operationen durchführen. + +**4.4** Die Studierenden können **Authentifizierung** in einem Hello-World-Setting umsetzen (mind. einfaches JWT oder Session-Cookie). + +**4.5** Die Studierenden kennen **Error-Handling** Patterns (try/catch + finally, Error-Klassen-Hierarchie). + +## Kapitel 5 — Testing + +### Lernziele + +**5.1** Die Studierenden können **Unit-Tests** mit Vitest (oder Jest) schreiben und ausführen. + +**5.2** Die Studierenden können **Testdriven Development (TDD)** an einem kleinen Beispiel durchspielen (rot → grün → refactor). + +**5.3** Die Studierenden können **Integration-Tests** für eine API schreiben (HTTP-Endpoint testen). + +**5.4** Die Studierenden kennen **End-to-End Tests** (Playwright/Cypress) und ihre Trade-offs gegenüber Unit-/Integration-Tests. + +**5.5** Die Studierenden können einen **Coverage-Report** lesen und beurteilen — wissen aber, dass 100% Coverage kein Qualitäts-Garant ist. + +## Kapitel 6 — TypeScript + +### Lernziele + +**6.1** Die Studierenden verstehen die **Rolle von TypeScript** — Aufsatz auf JavaScript für statisches Typchecking. + +**6.2** Die Studierenden können einfache **Typen** annotieren (string, number, boolean, arrays, objects, function-signaturen). + +**6.3** Die Studierenden können **Interfaces und Type-Aliase** definieren und unterscheiden. + +**6.4** Die Studierenden können **Generics** *lesen* (`Array`, `Promise`) — Schreiben ist Bonus. + +**6.5** Die Studierenden können **strict-mode tsconfig** Einstellungen verstehen (noImplicitAny, strictNullChecks). + +## Kapitel 7 — Docker + +### Lernziele + +**7.1** Die Studierenden verstehen das **Container-Konzept** — Trennung zwischen Anwendung und Host-System, „auf meinem Rechner läuft's"-Problem gelöst. + +**7.2** Die Studierenden können ein **Dockerfile** schreiben (FROM, COPY, RUN, CMD, EXPOSE). + +**7.3** Die Studierenden können **docker compose** für Multi-Container-Setups (App + Datenbank) verwenden. + +**7.4** Die Studierenden kennen **Multi-stage Builds** als Best Practice (Bonus). + +**7.5** Die Studierenden können Container in einer **CI-Pipeline** (GitHub Actions oder GitLab CI) builden + testen. + +## Kapitel 8 — Best Practices + +### Lernziele + +**8.1** Die Studierenden verstehen **Git-Hygiene** — sinnvolle Commits, **Conventional Commits** (feat:, fix:, docs:, …), `.gitignore` für Sprache + Editor. + +**8.2** Die Studierenden können eine **gute README** schreiben (was tut das Projekt, wie installieren, wie starten, wie testen, wie deployen). + +**8.3** Die Studierenden kennen **SOLID-Prinzipien** auf Code-Niveau und können sie *erkennen* (Anwenden ist Bonus). + +**8.4** Die Studierenden verstehen **12-Factor App** Prinzipien — Config über Environment, Process Stateless, ... + +**8.5** Die Studierenden können **Code-Reviews** geben + nehmen — wissen wie konstruktiv kommentieren. + +**8.6** Die Studierenden können **SemVer** (semantisches Versioning) anwenden + erklären (MAJOR.MINOR.PATCH). + +## Übergreifende Soft-Skills + +Diese sind nicht in einem Kapitel verankert sondern verteilen sich: + +- **Dokumentation lesen** (MDN, Node-Docs, npm-Package-Doku) — Block-übergreifend +- **Stack Overflow + GitHub Issues** als Lern-Tools verwenden — Kap 8 +- **Code-Repos sauber strukturieren** — Kap 8 +- **Industrie-Konventionen** erkennen + einhalten — alle Kapitel + +## Offene Fragen + +1. **Kap 1 splitten** in 1a (Browser-Stack + HTML) und 1b (A11y + DevTools)? Aktuell 1791 Zeilen = zu groß. +2. **Kap 6 TypeScript:** Tiefe — nur lesen-können oder auch selbst schreiben? +3. **Kap 8 Best Practices:** behält der Soft-Skills-Anteil oder fokussieren wir auf Hard-Skills (Git, README, SOLID)? +4. **Praxis-Phase-Bezug:** in welchen DHBW-Unternehmen sind die Studis verteilt? Stack-Verteilung würde uns helfen, die Schwerpunkte zu setzen (z.B. mehr Node oder mehr Java?). + +**Nach Beantwortung → leite ich daraus die Bögen pro Kapitel ab + plane die Slide-Restrukturierung.**