Trading technology · 2026
Trade Sider Terminal
A real number, or no number.
- Disciplines
- Web platform, Data engineering, Interface design
- Technology
- Next.js, React, TypeScript, PostgreSQL, Node.js, WebGL & GLSL
01
Challenge
Build a dense, customizable trading terminal on top of free and official data sources — without ever displaying a value that is not real, sourced and timestamped.
02
Architecture
- Every data category flows through a single provider registry with normalized types; widgets never call providers directly.
- Categories without a free official source resolve to an explicit “not connected” state through the same pipeline, rather than a placeholder number.
- Next.js App Router with server-side data routes as the only callers of external providers, Prisma on Postgres for accounts and the trade journal.
03
Design
A dark, dense workspace of draggable and resizable widgets across preset workspaces — Overview, Markets, Charts, Macro, News, Rates, Positioning, Seasonality, Calendar, Terminal TV, Portfolio and Risk — plus unlimited custom workspaces. Every widget carries its data source and freshness status.
04
Engineering
- Live freshness states that degrade honestly from live to delayed to stale based on each provider's own timestamps.
- Statistics such as seasonality, realized volatility and trade analytics computed in-house, with sample size and method disclosed in the interface.
- A trade journal with CSV and MT4/MT5 report import, and an optional third-party sync whose session tokens are encrypted at rest with AES-256-GCM.
05
Infrastructure
Server-side caching per provider, an in-memory rate limiter on authentication routes, bcrypt password hashing and JWT sessions, with route protection enforced in the request proxy.
06
Outcome
- Preset workspaces wired to real data wherever a free, keyless or official source exists.
- A data-honesty system shared by every widget: status pills, source footers and empty states.
- An extensible provider interface: connecting a new paid data source requires no widget changes.
07
Technology
- Next.jsRendering layer and edge of the application — routes, server components, API handlers.
- ReactInterface composition and client-side interaction.
- TypeScriptShared contract language across client, server and tooling.
- PostgreSQLSystem of record.
- Node.jsServer runtime for application and integration services.
- WebGL & GLSLGPU rendering surface for visual systems and game technology.
08
Lessons
Honesty is an architecture decision. Making “unavailable” a first-class state kept the whole interface trustworthy.
Disclosing method and sample size inside the interface costs little space and earns a lot of trust.
Building something with a similar shape?
Start a project