Skip to content
← Index
01 / 06Lead Developer2022 — now

Control

Control is a web-based digital production app: a freehand environment for real-world web production, where designers place elements by eye rather than by layout rules. It is my biggest project to date. I work across both halves of it — the geometry engine that makes freehand editing feel precise, and the server that turns a finished project into a live site on its own domain.

Control — capture
25feature slices
217port interfaces
325infrastructure adapters
57DI modules

The editor

I designed and built the geometry engine — shape manipulation, coordinate-space transformations, snapping and intersection detection, and the other primitives that make freehand editing feel precise instead of approximate. On top of it sits a custom SDK, so a published site renders editor output independently of the editor itself.

Architecture — clean architecture and SOLID, enforced by structure

The server is organised in four layers, and the dependency rule is enforced by directory rather than by convention. Use cases depend on narrow interfaces they declare themselves; they never learn which database or cloud provider is on the other side.

domainpure entities, no framework imports
appuse cases, each feature owning its own folder of port interfaces
i12einfrastructure adapters — Mongo, Redis, S3, AWS, Auth0, Stripe, GitHub
roota composition root wiring constructor dependencies explicitly, with declared singleton scopes
Dependency inversion, in three lines
export interface UploadFrameFilePort {
  uploadFrameFile(key: string, buffer: Buffer, contentType: string): Promise<void>;
}

Ports are narrow and single-purpose. The video decoding worker takes UploadFrameFilePort & DownloadAssetToFilePort in its constructor and never learns that S3 exists — which is the whole of dependency inversion and interface segregation, stated in one signature.

Publishing infrastructure

Publishing a Control site to a custom domain provisions real infrastructure automatically. ACM issues the TLS certificate, CloudFront serves the site with edge configuration in a key-value store, CodeBuild runs the build and distribute jobs, and S3 holds assets and build artifacts. Domain ownership and DNS propagation are verified before cutover, so a site never goes live pointing at nothing.

Async and realtime

Distributed lockingRedlock over Redis, so concurrent publishes and edits cannot race each other across server instances.
Message busRedis pub/sub fans events out between instances.
Queue workersBullMQ on a dedicated Redis connection: certificate-validation polling, account lifecycle, maintenance, preview generation and republish scheduling. Certificate issuance is slow and asynchronous, so it is a scheduled job rather than a blocked request.
Video scroll decodingA worker pulls a source video, decodes it to WebP frame sequences at 15 fps, uploads the frames and writes them back to the article — which is what makes scroll-scrubbed video possible in published sites.
Realtime collaborationA WebSocket server with a channel factory, heartbeat and schema-validated messages, fanned out across instances over the Redis bus.

Commerce and integrations

I own the payment and accounting layer: Stripe subscriptions, plans and quota usage. Around it sit Auth0 for identity, a GitHub App for exporting a project to a repository, esbuild for bundling custom components, and Sentry with structured logging for observability.

Frontend
ReactTypeScriptCanvasWeb Workers
Backend
Node.jsExpressMongoDBRedisBullMQWebSockets
Infrastructure
AWS S3CloudFrontACMCodeBuildECSDocker
Services
StripeAuth0GitHub AppSentry
Next — 02IBM X-Force