DEV Community

Aleksey Suvorov
Aleksey Suvorov

Posted on AI-assisted

How a struggling React project and an old Delphi habit led me to build a framework

#react #typescript #ai #architecture

This is part 2. Part 1 shows how to turn a vibe-coded MVP into something an AI agent can keep extending. Here is where UECA-React came from.

A project in trouble

In 2022 my company was rewriting a legacy web app: .NET Core on the server, React with Blueprint.js and MobX on the client. We are a small team. No dedicated designer, no business analyst.

I was on other projects and watched from the side. After a year of work, the code looked like a pile of low-level React with props drilled everywhere, and every developer had their own idea of how to build a layout. I could see it wasn't going to fly. I was worried the project would be shut down and the team cut.

So I decided to help.

The Delphi habit

I'm not a web developer by background. I grew up on Delphi, which I first saw in 1995. What struck me then was how clear frontend development could be: a component has properties, events and a visual part, and you build applications from them.

Even in Delphi I never wrote low-level code. I built reusable building blocks first and assembled applications from them. One more idea came from my old report-writer IDE: a message bus. A component shouldn't know who answers it, only that someone will. Picture a loud party where someone shouts "turn the music down!" The shouter doesn't know who is at the stereo, but the music gets quieter.

I spent a few months learning JavaScript, TypeScript, HTML and CSS properly. Then it clicked: with TypeScript's literal types you can generate things like onChange events for every property automatically. A component could be a black box with state, events, methods, children and a view, and every component could look the same.

Rails

I wrote the first version and showed it to the team. Developers are conservative, and they were wary. But the pattern leaves little room for improvisation. You write it the way the documentation says, like riding on rails.

After a couple of screens, the speed difference was obvious. Within a few months the team was rewriting those tangled screens on their own. The project was saved, and so were the jobs. Everyone still works there.

The name and the first AI help

The name, Unified Encapsulated Component Architecture, came from ChatGPT, which also helped me write the first documentation. I had designed the pattern with machine-generated code in mind before ChatGPT even existed. When models got good enough, the idea simply worked. I wrapped MUI components with Copilot, then moved to Claude Code.

What's next

The most surprising chapter was version 3.0, when an AI agent found bugs in my own code, wrote the tests, and built the framework's trace viewer. That's the next post.

In the meantime:

Top comments (0)