[DevDojo] Introduction to Mobile Development

To efficiently provide more user-friendly services, Mercari's mobile development team has established rules for release cycles and operational processes. In this course, we will explain the actual development cycle and process implemented in the development of Mercari's mobile apps.

Transcript

1. 1 Introduction to Mobile Development Hideaki Touhara Mercari Customer Experience Team / Software Engineer
2. 2 Confidential Today’s contents 1 Mobile development cycle overview 2 Details in each phase 3 Tech stacks
3. 3 Confidential • Goal ◦ All attendees know about overview of mobile development cycle ◦ All attendees know how to find related codebase corresponding iOS app UI • Non-Goal ◦ All attendees understand the detail of iOS/Android development and codebase ◦ All attendees can add new features to iOS/Android app Goal and Non-Goal of this presentation
4. 4 Confidential 1. Mobile development cycle overview
5. 5 Confidential 1. Create Specs (PM) 2. Create UI Design (Designer) 3. Write DesignDoc (Engineer) 4. Ticketing & Planning (Member) 5. Coding & create PR(s) (Engineer) 6. Dogfooding 7. QA (Engineer) 8. Release & Monitoring (Engineer/QA) Development cycle overview
6. 6 Confidential 2. Details in each phase
7. 7 Confidential • PM creates feature specs ◦ Create on Confluence ◦ Client Engineer is the counterpart of engineering side ▪ Review the Spec, give opinion, raise any concerns and etc... Create Specs (PM)
8. 8 Confidential • Designer creates UI design ◦ Create on Figma (mainly) ◦ Client Engineer should check about: ▪ Transition way (Push/Full-modal/Half-modal) ▪ Use of Design System ▪ Error states, Empty states ▪ Platform specific things (iOS/Android) ◦ Client Engineer gives opinions from the perspective of iOS/Android platform Engineer Create UI Design (Designer)
9. 9 Confidential • Engineer writes Design Doc before actual implementation ◦ Writing Design Doc helps us to understand what we should and what point we should be careful Write DesignDoc (Engineer)
10. 10 Confidential • Scrum members create tickets and have planning meetings ◦ Ticket type hierarchy: ▪ Epic: root ticket for a feature ▪ Story: User stories ticket for 1 epic ticket ▪ Task: fine-grained tickets for 1 story ticket (optional) ◦ Have planning meeting based on created Story(Task) tickets ▪ We use scrum as development style Ticketing & Planning (Member)
11. 11 Confidential • Engineer writes codes, codes and codes! ◦ Flow ▪ 1. Engineer codes ▪ 2. Create PR on GitHub ▪ 3. Get reviews & make modifications ▪ 4. Merge after approval • CI status is important ◦ Unit Tests, UI Test, Snapshot Tests, etc… ◦ Distribute to employees Coding & create PR(s) (Engineer)
12. 12 Confidential • We use Trunk-based development style as branch management ◦ Keep PR size small, Merge quickly ◦ Master branch is always ready for release ◦ Cover new features or dangerous code with FF to keep master stable Coding & create PR(s) (Engineer)
13. 13 Confidential • Some teams do dogfooding before QA as well ◦ Flow ▪ Create a dogfooding confluence/doc ▪ Schedule a meeting with the team to dogfood together ▪ Discuss on feedbacks received and take actions accordingly Dogfooding (Engineer)
14. 14 Confidential • We have dedicated QA members for each camp ◦ QA = Quality assurance (≠Manual tests) ◦ Each camp has QA members ◦ QA is also one of the responsibility of Mobile Engineers ◦ TestRail is used for managing test cases QA (Engineer)
15. 15 Confidential • Release ◦ Flow ▪ Cut release branch ▪ Release judgement test ▪ Submit to each app store (App Store, Google Play Store) ▪ Waiting for review from Apple and Google ▪ Release※Release related schedules are defined at Mercari • Monitoring ◦ Engineer should also check crash status after release ◦ Hot fix release is needed if crash status is severe Release & Monitoring (Engineer)
16. 16 Confidential 3. Tech stacks
17. 17 Confidential • Feature Flag ◦ Feature testing (≒ A/B test) system controlled by backend config ◦ It’s used for not only new features, but also refactoring and so on. • Log Platform ◦ Batch and Realtime log sending ◦ Well-structured log schema Feature Flag & Log Platform
18. 18 Confidential • Feature Flag × Log Platform = Data driven development ◦ Create a feature with some variants and integrate appropriate log for analyze. ◦ We can decide which variant is the base based on actual data (not inference) Feature Flag & Log Platform
19. 19 Confidential • We use JSON and Protobuf for HTTP request and response ◦ JSON: used for legacy endpoints ( ≒ mercari-api) ◦ Protobuf: used for microservice endpoints • We DON’T use gRPC for client ◦ gRPC is used for communications between microservices JSON & Protobuf
20. 20 Confidential • Design System provides consistent UI Design styles and components ◦ There are some layers similar with Atomic Design ▪ Styles, Elements, Components, Templates Design System Styles Elements Components
21. 21 Thank you!