Patterns

A General-Purpose Async Loading Component for React Query

One way to centralise loading, error, and retry UI for React Query without leaking query state into every component.

AI-Managed Documentation That Lives in Your Codebase

Embedding markdown documentation directly in your app and letting Claude maintain it produces docs that stay accurate, include real diagrams, and don't rot.

API Mocking Pattern for React and Storybook

A clean pattern for swapping between real and mock APIs without polluting your components with mocking logic.

Honour client-generated IDs when upserting entities — look up by ID, never mutate a loaded row's primary key, and replace rather than re-key when a natural key collides.

Data Model handling in TypeScript

A pattern for shared, runtime-validated data models that catch issues early and keep frontend and backend in sync.

Demo Driven Development

Building components in isolation with comprehensive demos catches edge cases that unit tests miss and ensures your UI handles failure gracefully.

E2E Testing with Playwright and Storybook

A testing strategy that mirrors how you build UIs — composable, isolated, and resilient to change.

The repeatable skeleton for a multi-window Electron + Vite + React app — three builds, a locked-down preload bridge, domain-scoped IPC, and the boot-time pitfalls that produce blank windows.

GitHub Actions CI/CD for building, signing, distributing, and auto-updating an Electron app via S3/CloudFront

Drill into or edit an existing entity in a URL-driven detail panel; reserve dialogs for disposable create/confirm/wizard flows.

Environment Configuration Best Practices

Fail fast with explicit values. No defaults, no fallbacks, no computed configuration.

Job-processing lambdas return success when execution completes normally; the job's outcome travels in the response payload, not as a thrown error.

Lambda Tips

Tips for making lambdas easier to debug and maintain.

Client writes commit to the local store and return; a background drainer delivers them to the server.

Managing the LocalStack Lifecycle

Treat LocalStack as disposable infrastructure. Destroy the container on every deploy and avoid partial teardowns.

Organising Environment Files

As the number of apps, services and environments grow over time, these tips keep your environment configurations files more manageable

Use React Query's request deduplication and cache invalidation to eliminate shared state — components fetch independently and stay in sync through query invalidation, not props or context.

Pitfalls and patterns for SceneKit rendering — render thread vs MainActor, constraint closures and actor isolation, scene-clock gating, and bone manipulation.

Service Events: Rolling Your Own Event Logging

A lightweight event tracking system built on DynamoDB that provides visibility across your services without the cost or complexity of third-party logging platforms.

Value-route every flow on a path-bound NavigationStack — an active view-destination link re-asserts its push whenever the path changes