Stack · only what is in the code
A Stack Chosen on Purpose
Every technology here really runs in this repository, and each one is backed by a decision with a reason and a trade-off. Nothing is listed just for the résumé.
- technologies in the code
- 20
- categories
- 6
- demos built on it
- 4
How We Choose
Why these tools, briefly, with the number of the entry in the decision log.
- 01D3
One Contract, Two Runtimes
Zod schemas in packages/contracts validate the request on the server and the response in the browser. Types are inferred from the schemas, so a mismatch between frontend and backend is caught by the compiler, not by a user.
- 02D17
Canvas Where Data Is Fast
Up to 1,500 events per second are drawn by uPlot on a canvas in a requestAnimationFrame loop. React does not re-render for each point, so the interface keeps the display’s frame rate.
- 03D5 · D14
Boring Infrastructure
A modular monolith, PostgreSQL, and no queue until one is genuinely needed. Fewer moving parts mean fewer failure points and faster onboarding.
- 04D6
Tested End to End
Vitest covers the logic of both apps, Playwright walks through every demo on desktop and mobile, and the API end-to-end tests run against a real database.
The Whole Stack
Filter by category; every card shows where the technology is used.
Next.js
FrontendApp Router, server rendering and locale-prefixed routes for indexable pages.
Official documentationUsed in
- The whole platform
React
FrontendComponent model for the application shell and every demo UI.
Official documentationUsed in
- The whole platform
TypeScript
FrontendStrict typing end to end, including the contracts shared by both apps.
Official documentationUsed in
- The whole platform
Tailwind CSS
FrontendUtility styling on top of a product-specific design-token layer.
Official documentationUsed in
- The whole platform
next-intl
FrontendEnglish and Ukrainian with the locale in the URL and typed message keys.
Official documentationUsed in
- The whole platform
TanStack Query
FrontendServer state, caching and request lifecycle for the demo APIs.
Official documentationuPlot
FrontendCanvas charts for the analytics dashboard and the real-time monitor; streaming charts redraw on every animation frame without React re-rendering.
Official documentationReact Flow
FrontendNode-graph diagram of the workflow explorer, drawn from the same definition the server executes.
Official documentationUsed in
@hello-pangea/dnd
FrontendPointer and keyboard drag-and-drop for reordering dashboard cards.
Official documentationUsed in
React Hook Form
FrontendForm state and validation wiring for the contact form.
Official documentationUsed in
- The whole platform
NestJS
BackendModular monolith behind /api/v1, one module per demo.
Official documentationZod
BackendOne schema per contract, validating requests on the server and responses in the browser.
Official documentationOpenAPI / Swagger
BackendGenerated API documentation served at /api/v1/docs.
Official documentationUsed in
- The whole platform
node-postgres (pg)
DataPostgreSQL driver: run state and events go through pooled connections and versioned updates.
Official documentationUsed in
ws (WebSocket)
Real-timeServer side of the real-time stream, used through the NestJS WebSocket platform.
Official documentationUsed in
Vitest
TestingUnit and integration tests for both apps.
Official documentationUsed in
- The whole platform
Playwright
TestingEnd-to-end tests over the real routes and the Developer Console.
Official documentationUsed in
- The whole platform
Docker Compose
InfrastructureReproducible local environment for the frontend, API, PostgreSQL and Redis.
Official documentationUsed in
- The whole platform
pnpm workspaces
InfrastructureWorkspace that keeps the apps and the shared contracts in one repository.
Official documentationUsed in
- The whole platform
EmailJS
InfrastructureDelivers contact requests from the browser through the existing Web-Mriya EmailJS service.
Official documentationUsed in
- The whole platform
Need a Team That Works This Way?
We choose tools for the problem and explain why. Tell us about your product and we will propose a stack and an architecture.