Commit Graph
17 Commits
Author SHA1 Message Date
libretech 722a4a9fe8 slides: 8 overflow-folien gefixt + fragmented-list-marker eingeführt
per user-feedback nach QA-render-check aller 493 folien (overflow-detector via PIL bottom-band-darkness):

223015b/01-daten-grundlagen s.036 nyquist:
  H1 'Nyquist-Theorem — warum 2× reicht' → 'Nyquist — warum 2× reicht'
  body text gekürzt, drei fälle als * statt - (marp fragmented list)

223015b/03-inhalte-bild-audio-video s.009 RGB→Y'CbCr:
  H1 verkürzt, bg right 50% → 45% contain, list-marker * (Y/Cb/Cr reveal)
  text 'unabhängig komprimiert werden' eingedampft

223015b/03-inhalte-bild-audio-video s.031 inter-frame:
  H1 'Inter-Frame-Kompression — die zentrale Idee' → 'Inter-Frame — die zentrale Idee'
  bg right 42% → 40% contain
  bullets I/P/B mit * (fragmented reveal)

223015b/05-distribution-metadaten s.012 EXIF-tabelle:
  8 zeilen → 5 zeilen (kamera+linse zusammengelegt, belichtung kompakt, software+bearbeitung zusammengelegt)

223015b/05-distribution-metadaten s.014 EXIF-stripping:
  7 plattform-zeilen → 5 (facebook+iMessage und E-mail+slack+discord zusammen)
  faustregel als italic-zeile statt bold-block

223015c/01-geschichte-grundlagen-html s.006 alan turing:
  bg right 35% (default fill) → 33% contain (verhindert dass composite-bild bis footer reicht)
  3 jahres-zeilen als * bullets (fragmented reveal)

dhbw/01_web_eng s.054 counter:
  in 2 folien gesplittet: 'Counter — Vanilla + React' und 'Counter — Vue + Svelte'
  pointe 'vier frameworks, dasselbe pattern: state → UI re-rendert' am ende der 2. folie

dhbw/08_best_practices s.005 .gitignore:
  code-block gekürzt: 6 sektionen → 5, mehrere lines pro logical group zusammengezogen (pem+key zusammen, vscode+idea zusammen)
  github.com/github/gitignore als markdown-link

bonus: wo pädagogisch sinnvoll - durch * ersetzt (marp progressive-reveal in presenter-modus). nicht überall — nur wo bullets sequenziell aufgedeckt werden sollten.

klausurfolien regeneriert (223015b 27, 223015c 19)
2026-05-14 20:48:38 +02:00
libretech 4053185e74 dhbw phase 4: alle 8 kapitel slide-MD komplett (4176 zeilen → ~1100 zeilen, ~210 slides total)
kap1 web_eng (104 → 57 slides): kurs-intro + prüfungsleistung-übersicht, internet-timeline (4 milestones), URL→pixel-7-schritte, HTTP, onboarding (node 24 LTS via fnm, brew/winget paket-manager, VS Code/Chromium/Hoppscotch, git setup mit SSH-key, projekt-skeleton), HTML (anatomie, self-closing, grundgerüst, semantik-tabelle, native elemente details/dialog/input-types), A11y volle tiefe (BFSG+EAA 28.06.2025, WCAG-POUR, Perceivable/Operable/Understandable/Robust einzeln mit code, testen mit lighthouse/axe/manuell), CSS-vorschau (anatomie/selektoren/spezifizität/box-model/farben/einheiten/pseudos), JS-vorschau (ECMAScript-timeline/grundlagen/DOM/fetch), frameworks-übersicht (react/vue/svelte/astro counter-vergleich), build-tools/rendering-modi, selbstlernen erste-eigene-seite

kap2 css_extended (13 → 28 slides): box-model + box-sizing global, flexbox basics+achsen+item-properties+typische-patterns, grid basics+areas+auto-layout, flexbox-vs-grid tabelle, mobile-first media queries, viewport-meta, fluid sizing mit clamp(), transitions (was performant), keyframe-animationen, prefers-reduced-motion pflicht, CSS-variablen + dark-mode-pattern, CSS functions (calc/clamp/gradient/oklch/filter), CSS-frameworks tabelle + tailwind pro/contra, selbstlernen flexboxfroggy+cssgridgarden

kap3 nodejs_basics (~22 → 20 slides): was-ist-node + warum-node-tabelle, fnm versions-manager + node 24 LTS + .nvmrc, npm init + package.json (mit type:module), ESM modern + CJS legacy, built-in modules (node: prefix), HTTP-server eingebaut + express, REST mit express (GET/POST/PUT/DELETE-pattern), alternative frameworks tabelle (fastify/hono/koa), routing-pattern mit Router, fetch global ab node 18, error-handling res.ok, environment variables mit dotenv + niemals committen, selbstlernen mini-API

kap4 nodejs_advanced (~24 → 22 slides): synchron-vs-asynchron, promise then-vs-async/await, sequenziell-vs-parallel + Promise.all, promise-methoden tabelle (all/allSettled/race/any), fs/promises lesen+schreiben, streams pipeline für große dateien, DB-übersicht SQLite/Postgres/MongoDB/Redis, better-sqlite3 prepared statements, ORM-übersicht (drizzle/prisma/knex), CRUD-pattern express+sqlite, auth-strategien tabelle, bcrypt für passwörter, JWT-pattern mit httpOnly+secure cookie, try/catch + error-klassen, globaler express-error-handler, selbstlernen REST+DB+auth

kap5 testing (~23 → 23 slides): test-pyramide 70%/20%/10%, vitest setup + describe/it/expect, AAA-pattern, matchers tabelle, TDD red-green-refactor mit konkretem beispiel, supertest für API-integration, test-DB :memory: + lifecycle hooks, mocking mit vi.spyOn (sparsam), playwright E2E mit role-based-locators, E2E-vs-unit tradeoffs, coverage realistisch (80% gut), CI mit github-actions, selbstlernen tests-schreiben

kap6 typescript (~30 → 19 slides): was-ist-TS + warum-tabelle, setup mit tsx + tsconfig.json + strict:true, basis-typen + any vermeiden, object-typen + interfaces + type-aliases, function-typen (Promise<T>), union + discriminated union + intersection, generics + constraints, built-in generics (Partial/Omit/Record), typ-inference (nicht über-annotieren), typen für REST-API mit express, zod runtime-validation + z.infer, any-vs-unknown-vs-never, best practices, selbstlernen API-zu-TS-migration

kap7 docker (~24 → 24 slides): auf-meinem-rechner-läufts problem, container-vs-VM tabelle, docker basics (image/container/dockerfile/registry), dockerfile hallo-welt, schichten + cache-optimierung, multi-stage build, base-image-größen tabelle (alpine ~180MB vs node ~1.1GB), .dockerignore, compose.yml beispiel, compose-commands, networking (service-namen als hostnamen), volumes (named vs bind), env+secrets, github-actions docker-build, registry-übersicht, health-checks, best-practices, selbstlernen app-dockerizen

kap8 best_practices (~30 → 28 slides): sinnvolle commits + conventional commits format, .gitignore template, branches+PRs workflow, README-template mit 6 sektionen, SOLID 5 prinzipien tabelle, S-single-responsibility + D-dependency-inversion mit code, 12-factor wichtigste (codebase/deps/config/processes/disposability), factor 3 config-in-env, factor 6 stateless-processes, SemVer MAJOR.MINOR.PATCH, package.json caret/tilde/exakt, code-reviews geben+nehmen + checkliste, doku-quellen tabelle (MDN/nodejs/npm/tc39/caniuse), stack-overflow gut-nutzen, AI-assistenten pro/contra (verstehen-nicht-kopieren), selbstlernen projekt-hygiene-check

build geht durch alle 8 kapitel-html+pdf
render-spot-check: cover-slide-dark-mode-invert, git-setup code-syntax-highlight, css-anatomie code-blocks — alle sauber

kein deploy, nur build+verify
2026-05-14 17:14:02 +02:00
libretech 82407679b5 dhbw 01_web_eng: ecmascript-history slide (ecma international, ECMA-262, ES15, kompat-tabelle), html-anatomie ascii-diagramm (opening/closing tag, content, element, attribute), css-anatomie ascii-annotation (#description-beispiel mit pfeilen auf property+value), framework-logos als bg right:25% auf react/vue/svelte/astro/webpack/vite/parcel slides, a11y-test-slide layout fix (image inline statt bg-right wie hdm) 2026-05-07 17:21:25 +02:00
libretech c242e0f947 dhbw inhalt: vorlesungsplan tabelle → cards-grid (4×3, milestones hervorgehoben), über-mich logos-collage, internet-101 erweitert (timeline + arpanet-bg + WWW-1989 + mosaic-bg + unterseekabel + heute + five-eyes), a11y/WCAG-block (~12 slides nach native html, vor css), direkt-install slide gesplittet (szenario / symptome), code-block-color → #f48fb1 (alle 8 files), section.invert h2 #f48fb1 für barrierefreiheit, ressourcen-slide auf 01-05 nach cover, alle emojis raus (✓✗⚠️🍞🥬🏆 + ↔), ESM statt CJS in 03/04, librete.ch domain, kleinere fixes (chromium statt chrome, CLI aufgelöst, JetBrains edu, hoppscotch, SOLID-abk., node 24 LTS, brew/winget/scoop/choco-links, vim/neovim/emacs editoren, herzlich willkommen) 2026-05-07 17:09:04 +02:00
libretech 52312f1cb8 dhbw assets: arpanet 1969 + arpanet 90er, mosaic-screenshot, unterseekabel-karte für internet-101 + 5 a11y-demos (kontrast, fokus, error, semantik, keyboard) für barrierefreiheit-block 2026-05-07 17:08:46 +02:00
libretech e2bab75e60 dhbw assets: 13 logos (uni-stuttgart, dhbw, klett, pons, langenscheidt, nextmarkets, re-cinq, experience-one, becklyn, caesargustav) + collage.png für über-mich-slide, dark-varianten der weiß-auf-transparent-logos 2026-05-07 15:29:45 +02:00
libretech b242c7b4e6 223015c 02 + dhbw 01: klausurfolien markiert, prosa-sätze bei allen tabellen, layout-fixes
223015c/02:
- glossar landkarte: klausur, prosa, reihenfolge (host→client→server→req→res→protokoll), tcp/http als beispiel
- glossar adressen/daten/eigenschaften/protokolle: prosa-sätze
- tcp/ip-modell: nichtssagenden satz ersetzt
- dateneinheiten: merkhilfe durch prosa ersetzt
- osi vs tcp/ip: bg right statt h:440, prosa statt einzeiler
- port: tabelle→liste, prosa statt bullets
- ip vs mac vs port: prosa
- tcp vs udp, http-methoden, status-codes, einheiten: prosa
- selektoren id + farben: klausur markiert
- farben: mdn-link, prosa-satz

dhbw/01:
- farben: prosa-satz synchronisiert
- über-mich: collage-bild hinzugefügt
2026-05-07 15:21:40 +02:00
libretech 46b297ada4 dhbw 01_web_eng: direkt-install slide ausgebaut (szenario, symptome), du-formen entfernt (sachlich/akademisch), editor-liste vim/neovim/emacs (helix raus), git inline erklärt 2026-05-07 14:48:33 +02:00
libretech 8dabc4e570 dhbw farb-schema: himbeer (wie hdm 223015c) — highlight #d63384, h1 #a02060, h2 #1f2937 (#f48fb1 auf invert für barrierearmut), pre/code #0f0f23/#d63384, dimmed #4a4a6a, invert-bg #001520→#000; herzlich willkommen statt willkommen; git kurz erklärt 2026-05-07 14:41:07 +02:00
libretech 6b33a79d9c dhbw 01_web_eng: über-mich aktualisiert (systems & platform engineer, dhbw-mail), onboarding-block (werkzeuge/os, node-install pro os mit lts node 24, versionsmanager, alternative runtimes deno/bun, editor, browser-devtools, http-clients, git setup, projekt-skeleton), html-block aus hdm (was ist html, anatomie, metadaten, tags+attribute, native html), css-block aus hdm (selektoren, spezifität, box-modell, farben, einheiten, pseudo-klassen, responsive), mandala-PNG mit erklärungs-folie, font 1.7→1.4rem, semesterplan + prüfungsleistung details, ascii-browser-request raus (PNG bleibt), kleine fixes (chromium statt chrome, cli aufgelöst, brew-link, jetbrains edu, hoppscotch, solid abkürzungen aufgelöst) 2026-05-07 14:21:19 +02:00
libretech a07ab0a3d1 dhbw 02_css_extended: native html-block + basic-selektoren + basic-pseudoclasses + specificity raus (jetzt in 01), einheitliche cover (sitzung 2 — html & css frameworks), font 1.7→1.4rem, fragen-slide raus 2026-05-07 14:21:00 +02:00
libretech 5c25b14a59 dhbw 03-04 (node.js basics+advanced): cjs → esm in code-beispielen (import + node:-präfix), legacy-cjs als vergleichsbeispiel markiert, einheitliche cover, font 1.7→1.4rem, fragen-slides raus, __dirname/__filename via import.meta.url 2026-05-07 14:20:46 +02:00
libretech 79fbe046d9 dhbw 05-08 (testing/typescript/docker/best-practices): einheitliche cover (web engineering / dhbw stuttgart / sose 2026 · sitzung x), font 1.7→1.4rem, fragen+hausaufgabe-slides raus (kein klausur an dhbw) 2026-05-07 14:20:35 +02:00
libretech 4b267bcb8b dhbw assets: html/css demo-pngs aus hdm kopiert (20 files) + web-engineering-mandala.png 2026-05-07 14:20:20 +02:00
libretech 96362e2959 dhbw: import original web-eng inhalte (testing, typescript, docker, best practices) + framework-übersicht, native html, prüfungsleistung-detail, sose 2026 2026-05-06 18:28:20 +02:00
libretech 73be35ccb8 dhbw: semesterplan sose 2026 (11 sitzungen) + deploy-path fix (kein doppeltes dhbw) 2026-05-06 17:03:44 +02:00
libretech 841a7ced76 dhbw: neuer kurs technik I — 4 kapitel + demo assets 2026-05-04 20:05:46 +02:00