Seite 16 - Design Patterns
-
Maxim Mironjuk
-
Februar 08, 2025
Hanging Punctuation setzt Anführungszeichen und andere Satzzeichen optisch außerhalb des Textblocks, damit die linke Textkante über alle Zeilen hinweg gerade wirkt. Mit der CSS-Eigenschaft hanging-punctuation lässt sich dieser jahrhundertealte Trick aus der Buchdruck-Typografie mit einer einzigen Zeile CSS umsetzen, ganz ohne negative Margins oder JavaScript-Hacks.
-
Maxim Mironjuk
-
Februar 07, 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.
-
Maxim Mironjuk
-
Februar 01, 2025
Das Singleton Pattern garantiert genau eine Objektinstanz. Magento 2 implementiert das über Shared Instances im DI-Container — elegant, testbar und ohne globale Kopplung. Die Registry-Klasse als globaler Datentopf ist seit 2.3 deprecated. Dieser Artikel erklärt warum und wie man es besser macht.
-
Maxim Mironjuk
-
Januar 28, 2025
Masonry-Layout packt Karten unterschiedlicher Höhe platzsparend zusammen, subgrid richtet innere Elemente präzise an den Spurenrastern eines übergeordneten Grids aus. Kombiniert lösen beide Techniken ein Problem, das reines Flexbox oder ein einfaches Grid allein nicht schafft, allerdings nur unter genauer Kenntnis dessen, was Masonry heute wirklich unterstützt und was nicht.
-
Maxim Mironjuk
-
Januar 26, 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.
-
Maxim Mironjuk
-
Januar 24, 2025
Wenn die Schreibseite eines Systems in einem Event Store lebt, muss die Leseseite nicht dasselbe Datenmodell verwenden. GraphQL und Event Sourcing passen erstaunlich gut zusammen, weil GraphQL-Queries genau das leisten, was CQRS-Lesemodelle brauchen, flexible, projektionsbasierte Abfragen ohne den Event-Strom selbst zu berühren.
-
Maxim Mironjuk
-
Januar 23, 2025
Ein System Design Review mit Claude ersetzt keinen erfahrenen Architekten, aber es deckt blinde Flecken auf, bevor eine Entscheidung in Code gegossen wird. Wer Architekturdokumente, Skalierbarkeitsfragen und Tradeoffs systematisch mit Claude durchgeht, findet Schwachstellen früher und dokumentiert Entscheidungen nachvollziehbarer als in einem informellen Meeting.
-
Maxim Mironjuk
-
Januar 22, 2025
Wer aus der Magento- oder Symfony-Welt kommt, kennt Dependency Injection bereits aus di.xml und dem Service Container. Dieser Artikel zeigt, wie sich dasselbe Prinzip in TypeScript-Projekten umsetzen lässt, mit Constructor Injection als Standardpattern, Interfaces als Verträgen für testbaren Code und der Entscheidung, wann ein DI-Container wie InversifyJS wirklich nötig ist.
-
Maxim Mironjuk
-
Januar 20, 2025
Alpine.js hat kein eingebautes computed(), aber JavaScript-Getter füllen diese Lücke fast vollständig. Wer weiß, wie Getter innerhalb von Alpine.data() reaktiv funktionieren, verkettet werden und sich von einer normalen Methode unterscheiden, baut abgeleitete Werte, die genauso sauber sind wie Computed Properties in Vue oder useMemo in React.
-
Maxim Mironjuk
-
Januar 19, 2025
Eine einklappbare Sidebar Navigation ist eines der häufigsten Layout Elemente in Dashboards und Admin Oberflächen. Mit Alpine.js lässt sich der komplette Zustand, vom Öffnen und Schließen über die Persistenz im Browser bis zur mobilen Overlay Variante, in einer kompakten Komponente abbilden, ohne React oder Vue laden zu müssen.
-