Product Engineer: A Former Backend Developer's Frontend Challenge with AI

In MyRealTrip's PEPE(Product Engineer Possibility Exchange) session, an engineer familiar with backend work shared the experience of building a frontend admin page with Cursor. The key was not simply handing code over to AI, but first designing a hub and a step-by-step structure where AI could accumulate context.

The work started in Figma. The designer had organized not just the screen layout but also policies and detailed requirements, and based on this, Cursor created a policy document containing the project background, user flows, per-screen requirements, and structural design, which was registered on the wiki.

Afterward, the work was not assigned all at once but broken down into stages.

• First building the foundational structure
• Then composing the main page
• Then implementing the type-specific screens in sequence

This approach was possible because the admin page had an independent structure separate from other features, the scope was clear, and existing patterns were well established. Development could proceed even without deep code knowledge, and if interrupted midway, work could resume from the documented stage.

On the surface it looked well-made, but there was actually a problem. Even when multiple items were edited on the admin page, the structure called an individual API for each item, so if there were 30 items, there would be 30 communications. The screen appeared to work normally, but from an operational standpoint, the design was inefficient.

Afterward, the design documents accumulated on the wiki were updated, and the changes were reflected separately on the backend and frontend sides. At the same time, the structure was changed so that the frontend editor directly referenced the local backend repo, allowing AI to read the code itself rather than the documentation to continue the work.

Going further, an AI-dedicated work hub was also created to handle all work from a single editor. By specifying tasks under a workspace directory and linking the repos to be referenced, AI could move across multiple repos and handle frontend and backend together. New tasks could also be started directly in subdirectories of the hub, reducing the need to repeat explanations each time.

This experience also expanded into a personal work environment. A dev workstation concept was pursued, where entering work style, tech stack, company information, and growth goals during onboarding would let AI provide customized guidance, and a structure connecting the wiki and project repos via MCP(Model Context Protocol) was also designed.

There were also failures, on the other hand. Git worktree was used for parallel work, but the process of organizing and merging work across multiple branches got tangled, and context ended up scattered instead. The conclusion was clear: the key to AI collaboration is not good prompts, but creating an environment where context can be concentrated and accumulated.