Tag: React

1. Optimistic Updates jenseits von useOptimistic: Rollback mit TanStack Query

   07.02.2025

   Reacts useOptimistic-Hook löst einen einzelnen, lokalen Anwendungsfall elegant, scheitert aber an verschachtelten Listen, parallelen Mutationen und Race Conditions über mehrere Komponenten hinweg. Dieser Artikel zeigt, wie Optimistic Updates mit TanStack Query Mutations, Snapshot-basiertem Rollback und expliziter Query-Cancellation in echten Anwendungen robust werden.

   Read more

2. React Warenkorb State mit Magento Backend synchronisieren

   04.02.2025

   Der React Warenkorb ist die Komponente, bei der Kunden am empfindlichsten auf Inkonsistenzen reagieren. Optimistische Updates lassen die UI sofort reagieren, während im Hintergrund die tatsächliche Synchronisation mit dem Magento Backend läuft, inklusive sauberer Konflikt-Auflösung und Multi-Tab-Abgleich.

   Read more

3. React Native vs PWA: Entscheidungshilfe für Teams

   31.01.2025

   Die Frage React Native gegen PWA lässt sich nicht pauschal beantworten, sondern hängt von konkreten Produktanforderungen ab: App-Store-Sichtbarkeit, Zugriff auf native Hardware, Offline-Verhalten und verfügbares Budget. Dieser Artikel liefert eine strukturierte Entscheidungsgrundlage mit echten technischen Grenzen statt Marketing-Versprechen.

   Read more

4. Code teilen zwischen React Web und React Native

   29.01.2025

   Realistisches Code-Sharing zwischen React Web und React Native bedeutet nicht, dieselben Komponenten überall zu verwenden, sondern gezielt zu trennen, was plattformunabhängig ist, von dem, was es nicht sein kann. Business-Logik, Typen, API-Clients und Validierung lassen sich sauber teilen, Oberflächenkomponenten meist nicht. Dieser Artikel zeigt eine funktionierende Monorepo-Struktur mit echten Beispielen.

   Read more

5. React Strict Mode und Double Invocation: warum Bugs dadurch sichtbar werden

   29.01.2025

   Meine App verhält sich im Development-Modus seltsam, im Production läuft sie einwandfrei" – dieser Satz ist ein Warnsignal, kein Entwarnung. React Strict Mode macht Bugs sichtbar, die in Production irgendwann auftreten werden. Das Doppelt-Ausführen ist kein Bug, sondern eine präzise Diagnosestrategie.

   Read more

6. Redux Toolkit: Moderne Patterns mit RTK Query und createSlice

   26.01.2025

   Redux Toolkit hat klassisches Redux mit seinen endlosen Switch Statements und Action Type Konstanten weitgehend abgelöst. Mit createSlice, RTK Query und Entity Adapter lässt sich globaler State in React Anwendungen mit deutlich weniger Code, dafür mit mehr Typsicherheit und eingebautem Server State Caching abbilden.

   Read more

7. ARIA Live Regions in React: Dynamische Inhalte für Screenreader

   24.01.2025

   Ein Formular-Fehler, eine neue Toast-Nachricht oder ein aktualisierter Warenkorb-Zähler bleiben für Screenreader-Nutzer unsichtbar, solange React den DOM nur visuell aktualisiert. Eine ARIA Live Region schließt diese Lücke, indem sie Änderungen aktiv ankündigt, ohne den Tastaturfokus zu verschieben oder laufende Eingaben zu unterbrechen.

   Read more

8. Infinite Query Patterns mit TanStack Query: Pagination ohne Schmerzen

   18.01.2025

   Lange Listen mit Nachladen beim Scrollen sind eine der häufigsten UI-Anforderungen, aber naive Implementierungen scheitern regelmäßig an Duplikaten, Speicherverbrauch und inkonsistenter Scroll-Position. TanStack Querys Infinite Query löst diese Probleme mit einer klaren Seiten-Struktur, cursorbasierter Navigation und lässt sich mit Virtualisierung kombinieren, um auch zehntausende Einträge flüssig darzustellen.

   Read more

9. Vite für React: Warum Create React App tot ist

   07.01.2025

   Create React App ist offiziell deprecated und wird nicht mehr gewartet. Vite hat den Standard für React-Tooling übernommen: natürliches ESM im Dev-Server, Sub-100ms Hot Module Replacement und eine Konfiguration, die ohne Eject auskommt. Dieser Artikel erklärt, warum der Wechsel sich lohnt und wie er reibungslos gelingt.

   Read more

10. TanStack Router: Typsicheres Routing in React

    04.01.2025

    Routing in React war lange eine Quelle von Laufzeitfehlern: falsche URL-Parameter, untypisierte Search Params, fehlende Routen-Guards. TanStack Router löst das durch ein vollständig typsicheres Routing-System, bei dem der TypeScript-Compiler jeden Fehler in Navigation, Params und Search Params erkennt – bevor der Code den Browser erreicht.

    Read more