Supporting Mercari’s development and quality assurance by in-app dev tools
At Mercari, we’ve been working to create a better architecture and a development environment for Android to improve our team’s productivity. Today in this article, I’m going to explain how in-app developer tools (in short dev tools) are implemented into our app and what kind of tools we currently have.
Why are in-app dev tools important
When mobile engineers develop their app, there is always collaboration between back-end engineers and QA engineers. It is a huge burden for these non-mobile engineers to address a client side codebase to test new features. Examples would be:
- Switching to several development API servers
- Updating internal app settings (user attributes) and variants for feature flags
- Opening specific screens (E.g. dialogs that can be opened in a complex condition)
Having in-app dev tools to provide back-end and QA engineers functions to make changes to the app settings allows them to work on their tasks more efficiently and independently.
How Mercari’s in-app dev tools work
Our dev tools can be accessed using a shake gesture of a device. For Android, we use Debot, a library that creates a menu dialog for debugging. The good thing about using the shake gesture is that it does not affect our app’s UI.
Dev Tools Menu
Let me introduce some of the tools at Mercari.
Switch dev server and React Native bundle file
Our development environment runs every opened API Pull Requests. We specify which server to access by adding a Github’s Pull Request number in Http Header. This is same for React Native that we use in our app.
From the Dev Support section in the developer tool, we can see which server is currently selected. We can also edit a Pull Request number which will override Http Header immediately without updating the client codebase.
Internal application and user information
Internal user information such as UUID and API Tokens are listed in the dev screen. This information is useful for the back-end team to investigate errors that happened while in development. The internal settings are also accessible from here. This is especially useful when developers just want to turn on or off internal flags like “passed tutorial screens”. Also in the same section, there are shortcuts to some screens to check functionalities and designs.
Feature flags and experiment variants
We use Firebase Remote Config for Experiments and Feature Flaggings. One disadvantage of using Remote Config is that it takes extra time to open a browser and to update values from Firebase console to change the variants. We created a repository class which stores the values of Remote Config on memory and made it accessible from dev tools so that variants can be updated locally.
Wrap up: Increase developer velocity with better dev tools
At Mercari, the dev tools we built helped the back-end and QA teams make sure features work as expected. We also felt that the dev tools made us focus on development by reducing the time to deal with minor configuration changes to test functionality. Although dev tools may be regarded as low priority since it’s an internal tool that is not exposed to our users, we believe building better dev tools increases our productivity in the end. And if you want to discuss and develop the service that connects sellers and buyers all over the world, join our global engineering team!
Tomoaki Imai is a mobile developer at Mercari. He focuses on building a better architecture and development environment to improve the team’s productivity.
