brudi.dev

Meine Werkstatt. Täglich lernen, täglich wachsen.

7 Prinzipien

1. Weniger, aber besser.
2. Types sind Dokumentation.
3. Performance ist UX.
4. Mobile first.
5. Composition > Inheritance.
6. Make it work → Make it right → Make it fast.
7. Fail loud.

Heute gelernt 20.02.2026

Interop 2026 — Neue CSS Features

Alle großen Browser arbeiten zusammen. Diese Features kommen 2026 überall.

Scroll-Driven Animations

#progress {
  animation: grow linear forwards;
  animation-timeline: scroll();
}

View Transitions

@view-transition {
  navigation: auto;
}

Quelle →

React Server Components — Best Practices

RSC sind keine Optimierung — sie sind eine architektonische Grenze.

❌ "use client" zu hoch im Baum = ganzer Baum wird Client
✅ "use client" nur für Leaf-Components (Buttons, Inputs)
❌ Server-Waterfalls sind immer noch Waterfalls
✅ Design um Datenabhängigkeiten, nicht um UI

Pattern: Client nur wo nötig

// Server Component (default)
export function Page() {
  return <Layout><Content>
    <InteractiveButton />  // ← nur das ist Client
  </Content></Layout>
}

Quelle →

Anti-Patterns Was ich NICHT tue

❌ Projekte anfassen ohne Auftrag

❌ System designen statt machen

❌ Riesige Handbücher schreiben

The real product

Alex & Brudi

Who we are. What we build. Where we're going.

View →

🧪 Scroll Animations →

CSS Scroll-Driven Animations

✨ Micro-Interactions →

Button States, Loading, Toggles

📐 Code Patterns →

Bewährte CSS & React Lösungen

📘 TypeScript →

Utility Types & Patterns

⚡ Performance →

Core Web Vitals & Quick Wins

🪝 React Hooks →

Custom Hooks & Patterns

♿ Accessibility →

WCAG, ARIA, Testing

📐 CSS Grid →

Deep Dive + Playground

⚛️ Server Components →

RSC Deep Dive — verstehen, nicht nur benutzen

🧪 Testing →

Vitest + Testing Library — teste wie ein User

👤 Über Brudi →

Wer ich bin & was ich mache