Tag: React

1. React Context vs. Zustand vs. Jotai – Was wann nutzen

   09.04.2025

   Die falsche Wahl beim State Management kostet in React-Projekten mehr Performance und Wartbarkeit als fast jede andere Architekturentscheidung. Context, Zustand und Jotai lösen dasselbe Grundproblem auf grundlegend verschiedene Weisen – dieser Artikel erklärt die Unterschiede mit echten Codebeispielen und zeigt, wann welches Tool die richtige Wahl ist.

   Read more

2. Apollo Client in React: GraphQL-Cache richtig normalisieren

   22.03.2025

   Apollo Client normalisiert GraphQL-Antworten automatisch in einen flachen Objektgraphen, aber ohne saubere Type Policies und ohne durchdachte Cache-Updates entstehen schnell veraltete Ansichten. Dieser Artikel zeigt, wie InMemoryCache wirklich funktioniert, wie eigene Cache-Schlüssel mit keyFields definiert werden und wie Mutations, Pagination und Debugging in der Praxis zusammenspielen.

   Read more

3. React Monorepo mit Turborepo aufbauen

   19.03.2025

   Ein React Monorepo mit Turborepo bündelt mehrere Apps und geteilte Pakete in einem Repository, ohne dass jeder Build alles neu kompilieren muss. Dieser Artikel zeigt die Workspace-Struktur, die turbo.json-Konfiguration, Remote Caching und eine CI-Pipeline, die nur tatsächlich betroffene Pakete baut.

   Read more

4. React + Symfony Fullstack-App mit API Platform

   18.03.2025

   Symfony ist das robusteste PHP-Framework für komplexe Backend-Logik. React ist das mächtigste UI-Framework für dynamische Frontends. API Platform verbindet beides durch automatisch generierte REST- und GraphQL-APIs — mit Validierung, Serialisierung und OpenAPI-Dokumentation out of the box. Dieser Artikel zeigt, wie man die beiden Welten produktionsreif zusammenführt.

   Read more

5. React useImperativeHandle: Refs richtig nach außen exponieren

   16.03.2025

   Einen rohen DOM-Node via Ref nach außen zu geben, ist eine Einladung zu unkontrolliertem externem Zugriff. useImperativeHandle definiert präzise, welche Methoden über den Ref verfügbar sind – eine kontrollierte API statt einer offenen DOM-Schnittstelle.

   Read more

6. React useId: Stabile IDs für Accessibility-Attribute

   08.03.2025

   Barrierefreiheit in React-Komponenten scheitert oft an einem Detail: IDs für aria-labelledby und htmlFor müssen einmalig sein und auf Server und Client übereinstimmen. useId löst beides auf einmal – ohne Boilerplate und ohne Hydration-Fehler.

   Read more

7. Slot basierte Komponenten APIs in React

   27.02.2025

   Slot basierte Komponenten APIs ersetzen das Root Element einer Komponente durch genau ein uebergebenes Kindelement, statt ein zusaetzliches DOM Element einzufuegen. Das asChild Muster von Radix hat diesen Ansatz populaer gemacht, doch die zugrunde liegende Slot Komponente laesst sich auch ohne fremde Bibliothek in wenigen Zeilen selbst bauen.

   Read more

8. Headless UI Patterns in React: jenseits von Radix

   26.02.2025

   Headless UI Patterns trennen Interaktionslogik konsequent von der visuellen Darstellung, sodass Teams eigenes Design ohne Kompromisse bei Tastatursteuerung und ARIA-Semantik umsetzen koennen. Wer versteht, wie Custom Hooks, Compound Components und State Machines zusammenspielen, braucht fuer viele Anwendungsfaelle keine externe Headless-Bibliothek mehr.

   Read more

9. React Reconciliation: Wie der Virtual DOM wirklich arbeitet

   25.02.2025

   Wer React nur an der Oberfläche kennt, weiß, dass der Virtual DOM „schnell macht". Wer React performant bauen will, muss verstehen, wie der Diffing-Algorithmus entscheidet, was aktualisiert wird – und warum Keys, Komponentenidentität und Fiber-Architektur dabei der entscheidende Faktor sind.

   Read more

10. React Server Components: Der komplette konzeptuelle Guide

    14.02.2025

    React Server Components sind kein neues Rendering-Modell – sie sind ein fundamentaler Paradigmenwechsel. Das Denken in Client-only-Komponenten funktioniert nicht mehr. Wer RSC wirklich versteht, baut Apps, die weniger JavaScript ausliefern, schneller laden und Datenbankzugriffe direkt in Komponenten kapseln können.

    Read more