React

Components, state, composition.

React 19 is the library every Irish dev team eventually standardises on. Hooks, composition, state management, the concurrent renderer. The ecosystem is vast — and mature enough that the "should we use React" argument ended years ago.

React 19 · concurrent rendering

Ecosystem: unmatched

React DevTools · Component Tree

<App />

<Nav />

idle · no state changesReact 19.0

What we build with React

Six years, hundreds of components, no regrets.

Custom admin dashboards

Internal tools, data visualisation, complex forms, multi-step wizards. Where off-the-shelf admin UIs fight your actual workflow.

Progressive web apps

Mobile-first PWAs that install on home screen, work offline, push notifications. Shopify storefronts, event apps, field service tools.

Marketing microsites

Campaign sites, landing pages, product launches with heavy interactivity. React shines where motion + content need to coexist.

Design system + component libraries

Shadcn/ui, Radix, custom systems. Build once, reuse across products. Accessibility baked in.

Headless storefronts

Shopify, BigCommerce, commercetools — decoupled frontends in React with full design control. Wrapped by Next.js or Remix.

Real-time dashboards

Live data streaming, WebSocket subscriptions, chart updates. React's concurrent renderer handles high-frequency updates gracefully.

Our default React stack

The tools we actually reach for — battle-tested, not trendy.

Framework

Next.js 15 (App Router)

Server Components, routing, data fetching, deploy — all in one.

Styling

Tailwind CSS

Utility-first, no context-switching, no dead CSS. Pairs with shadcn/ui.

Components

shadcn/ui + Radix UI

Copy-paste accessible primitives. Own your components, not a dependency.

State

Zustand + React Query

Zustand for UI state; React Query for server state. Avoid Redux unless genuinely needed.

Forms

React Hook Form + Zod

Uncontrolled forms for perf; Zod for runtime validation + TypeScript types.

Animation

Motion (Framer)

Layout animations, gestures, transitions without fighting React's render cycle.

Data-viz

Recharts / Visx / D3

Recharts for 80% of charts; Visx when you need custom composition.

Testing

Vitest + Playwright

Vitest for unit/integration; Playwright for E2E. Both Vite-native, fast.

TypeScript

Always

No excuses. TypeScript strict mode on every new project. Types catch bugs before production.

How we write React

The patterns we enforce in every project.

Composition over inheritance

Build small focused components. Compose them via children prop, slots, or render props. Avoid massive components with 30 props.

Server state vs client state

React Query owns server state (remote data, cache, sync). Zustand or useState owns client state (UI, forms). Don't conflate — they have different lifecycles.

Colocate components with their data

`feature/products/` folder contains component, hook, types, tests. Changes to one feature don't touch three other folders.

Types first, implementation second

Write the Zod schema or TypeScript interface before the component. Types drive the shape of everything downstream.

Accessibility by default

Semantic HTML, ARIA when needed, keyboard navigation, focus management. Radix UI primitives handle the hard parts.

Avoid premature optimisation

No useMemo, useCallback, React.memo until profiling says you need it. Readable code beats "optimised" code every time.

When not React

Honest alternatives we recommend.

Astro

Pick when: Content-heavy sites with minimal interactivity. Blogs, docs, marketing. Ships ~0 JS by default.

Svelte / SvelteKit

Pick when: Smaller bundle sizes matter. Teams that prefer compiled-away reactivity over React's runtime.

Vue / Nuxt

Pick when: Your team already knows Vue. Template-first syntax. Huge in some Irish agencies for legacy reasons.

HTMX / Hotwire

Pick when: Rails, Laravel, Django backends where you want server-rendered HTML + tiny interactivity layer. Avoid full SPA complexity.

Frequently asked

React questions.

Plain React via Vite is perfectly valid for SPAs (logged-in apps, dashboards). Next.js adds server rendering, routing, data fetching — use it when SEO, marketing pages, or fullstack matter. We pick based on project, not dogma.

Yes, with Expo + React Native for iOS/Android from the same React codebase. Best fit is content-driven apps or extensions of a web product. For heavy native features or performance-critical UX, we'd recommend native Swift/Kotlin.

Server state in React Query (TanStack Query). Client state in Zustand for complex cases, plain useState for simple. Redux only for codebases that already use it — we don't introduce it for new work.

Code splitting (route-based + component lazy loading), React Query for data-caching, virtualisation for long lists (TanStack Virtual), Suspense + Server Components where available. We profile with React DevTools before optimising anything.

Yes. We audit it first (React version, dependency health, build tooling, testing coverage, accessibility), propose upgrades/refactors as a phase-1, then feature work. Much safer than inheriting a mess and shipping bugs.

Paired with React

Got a React project? Or inheriting one?

Free 45-minute call — we can scope new React work, audit an existing codebase, or pressure-test whether React is even the right pick. No pitch.