Building EGP Cards at Merpay: Lessons from a Frontend Internship
Hello, my name is @Yusaku (Yusaku Miyata), and I’m currently interning as a Frontend Engineer on the Growth Platform team at Merpay.
This article is part of the Merpay & Mercoin Advent Calendar 2025, and I am honored to write the entry for Day 25.
I started my internship in October 2025, and I’m now in now my third month (Figure 1).
In this article, I would like to share the tasks I worked on during the internship and the key learnings I gained through hands-on development.
Figure 1: My selfies at the office
About the Team
I belong to the Growth Platform Frontend Team, which develops an internal marketing tool called Engagement Platform (EGP).
EGP enables marketers and project managers to perform CRM-related tasks—such as distributing points or coupons, creating and publishing landing pages, and managing campaigns—without writing any code (Figure 2).
Figure 2: EGP No-code Editor (EGP Content)
During this internship, I worked on improving a feature called EGP Cards.
EGP Cards allows users to create and publish card-based UI components that can be used across multiple platforms, including Web, iOS, and Android. Unlike the page editor feature (EGP Pages), EGP Cards adopts a Server Driven UI architecture, where the server returns the structure of the user interface. The content created in the editor is stored as JSON and rendered consistently across different platforms (Figure 3).
For more details on the architecture of Server Driven UI and EGP Cards, please refer to the following article by @togami and @Stefan from the same team:
- WYSIWYG Web Page Builder and Its Extension to Server Driven UI
- Supercharging User Engagement: How Mercari is Using Server-Driven UI to Reduce Time-to-Market
Figure 3: EGP Cards Editor Screen
Task 1: Dry Run for EGP Cards
Overview: What is Dry Run?
Dry Run is a feature that allows users to simulate states by assigning mock data to variables. With this feature, users can verify content behavior before writing API calls or testing on real devices. In this task, I implemented Dry Run functionality for EGP Cards (Figure 4).
Figure 4: Implemented Dry Run Feature for EGP Cards
How It Works
The Dry Run feature works as follows:
- Users enable Dry Run and input mock data into fields
- The editor recursively traverses the structure tree, dynamically evaluates JavaScript code, and replaces variables with actual values
- The resolved values are rendered on the canvas
Implementation Process
I proceeded with the implementation in the following steps:
- Read and analyzed the existing Dry Run implementation in EGP Pages through code reading and logging
- Implemented a similar feature for EGP Cards while taking Cards-specific specifications into account
During development, I searched for reusable logic between EGP Pages and EGP Cards, and carefully extracted common code into shared files to improve readability and maintainability.
Task 2: Content Agent Improvement for EGP Cards
Background: Challenges with Content Agent
EGP Content, the no-code editor in EGP, supports multiple content types such as Cards, Pages, and E-mails. Recently, an AI agent called Content Agent was introduced, enabling users to summarize or rewrite content through conversational interactions (Figure 5).
However, at the time, Content Agent did not fully understand the editor-specific constraints of each content type. As a result, it could generate content with broken UI structures, which might fail to meet users’ expectations.
Figure 5: Conversation Processing Pipeline of Content Agent
Implementation Approach
To address this issue, I implemented the following solution:
- Created prompts describing the specifications and data structures of EGP Cards
- Injected these prompts conditionally into the Agent Layer of Content Agent
EGP Cards has several constraints, such as not supporting media queries and requiring all elements to be structured with Flex layouts. By explicitly describing these constraints and expected outputs in the prompt, Content Agent can now generate content more suitable for EGP Cards (Figure 6).
Figure 6: Using Content Agent in EGP Cards
What I Learned
How to Deliver Output in Team Development
Through the implementation of the Dry Run feature, I learned a great deal about how to deliver effective output in a team development environment. I realized that not only the correctness of the implementation and the completeness of features, but also how pull requests (PRs) are structured and how reviews are handled, have a significant impact on the overall development efficiency and productivity of the team.
More specifically, I learned that even for bug fixes or refactoring tasks, it is important to split changes into separate PRs when the scope becomes too large or extends beyond the original task. Doing so helps reduce the review cost and makes the intent of each change clearer. I also came to understand the importance of explicitly describing the implementation intent in code and PR comments—such as why a particular approach was chosen, what alternatives were considered, and which options were intentionally not taken. This practice helps prevent misunderstandings with reviewers and leads to more constructive discussions.
When receiving reviews, I also learned that it is important not to jump straight into making fixes. Instead, taking the time to first understand the reviewer’s intent can lead to better design decisions and higher-quality implementations. In some cases, aligning on assumptions and background through discussion proved essential. Through these experiences, I strongly recognized that delivering value as a team requires not only individual coding skills, but also clear communication and a collaborative mindset.
Understanding Mercari Culture Through Real Experience
Mercari is often described as a company where transparency and flat communication give individuals a high level of ownership. Through this internship, I strongly felt this in practice.
What stood out to me the most, however, was the global, English-first development environment.
All of my previous internships were conducted in Japanese, so working in an environment where documentation, communication, and discussions were entirely in English was a refreshing experience. While I understood that smooth communication in English is essential in a global team, being able to practice this in real development work was highly rewarding.
In my daily work, I read English README files and specifications, created Pull Requests in English, and explained design decisions and concerns through discussions.
To avoid misunderstandings, I sometimes supplemented explanations in Japanese when necessary, while proactively communicating with the team.
Through this experience, I realized that Mercari’s culture is not just a slogan, but something deeply embedded in everyday work.
Rediscovering the Depth of Technical Challenges
Until now, I had mainly worked in frontend development through internships and personal projects, and I felt that my learning in this area might be approaching a plateau.
However, working on EGP completely changed that perception. While EGP provides a highly interactive and rich UI, it is supported by complex internal logic, such as no-code content creation and delivery mechanisms, as well as safe and efficient interactions with AI agents.
During the tasks, I received requirements at a relatively abstract level and broke them down into concrete implementation steps on my own. While learning how EGP is used, I also proposed improvements—such as adding image preview functionality—that could enhance user experience.
In addition, when improving Content Agent, I designed the implementation so that it would not be limited to Cards only, but could be easily extended to other content types like Pages and E-mails in the future. By separating prompts by content type, I focused on readability and extensibility.
This experience taught me that designing with a long-term product perspective directly contributes to better user experience, improved efficiency, and ultimately business value—something I find particularly compelling about Mercari.
Closing
Through this internship, I was able to learn not only technical skills, but also how to approach engineering from the perspective of product value and team collaboration.
I hope to continue applying these learnings to my future development work and personal growth as an engineer.
Thank you very much for reading.
