LIG/ソニックムーブ/ガラパゴス 3社合同勉強会(2016/06/27)

1. アプリ開発の境界問題を
支えるツール
Keishi HOSOBA, Galapagos Inc.

2. About me
• 株式会社ガラパゴス所属
• サーバ寄りの、何でもやる係
• GitHub: https://github.com/hosopy
• Qiita: https://qiita.com/hosopy
• Twitter: https://twitter.com/hosopy

3. About Galapagos
• https://www.glpgs.com
• スマートフォンアプリの受託開発
• 2010年に初代iPadアプリを開発したのを機にスタート
• 踏んだ地雷数には自信があります！
• 技術
• 言語: Swift, Java, Ruby, Python …
• ライブラリ: Rails, TensorFlow, …
• インフラ: AWS, VMWare(社内), OpenNebula(社内)
• その他: Slack, GitLab, GitLab-CI, Docker, Jenkins, Fastlane,
TerraForm, Ansible, Vagrant, …

4. 自社アプリ
運動習慣支援アプリ
iOS
ひっそり30万DL
SpriteKit, WatchOS
猫好きホイホイアプリ
iOS
ニャー
障害対応のお供に
うごく猫Start fit

5. 境界問題
今日のテーマ

6. 境界問題
デザイン 開発

7. デザイン 開発
境界問題
このデザイン、Android
だとキツイよー
ここはトルツメなのか？
その場合この余白は？
ああ、また書き出しorz
@2x,@3x,xhdpi,xxhdpi…
Androidよう分からん

8. デザイン 開発
境界問題
担当領域の知識差や前提の食い違いに起因する
手戻りや調整コスト
境界を繋ぐために必ず発生する
一定の作業

9. デザイン 開発
問題解決の基本は人間・組織・仕組みから
コミュニケーション
組織 仕組み

10. 技術やツールで解決が促進されることもある
技術・ツール
デザイン 開発
コミュニケーション
組織 仕組み

11. 本日のお話の中心
技術・ツール
デザイン 開発
コミュニケーション
組織 仕組み
ガラパゴスでの
技術・ツール導入事例

12. アプリ開発プロセスにおける主な境界
サーバ
アプリ
アプリ配布境界
デザイン
API境界
デザイン境界
テスト

13. デザイン境界
サーバ
アプリ
アプリ配布境界
デザイン
API境界
デザイン境界
テスト

14. デザイン境界

15. デザイン境界の問題
• デザイン指示
• 色, 余白, トルツメ, …
• デザイン指示の変更管理
• asset管理
• @2x, @3x, xhdpi, xxhdpi,…

16. Zeplinの導入
デザインデータをSketchからエクスポートすると、デザ
インの情報を専用アプリ上で簡単に共有出来るサービス
https://zeplin.io/

17. デザイン指示の確認

18. カラー定義

19. コメント

20. Slackで変更通知やコメント通知

21. Zeplinの効果
• デザイナーとエンジニアの間で、デザインに関するコ
ミュニケーションが促進された。
• デザインと開発の調整が効率化された。

22. API境界
サーバ
アプリ
アプリ配布境界
デザイン
API境界
デザイン境界
テスト

23. API境界

24. API境界の課題
• APIドキュメントメンテナンスコスト
• Excel仕様書の苦痛
• 仕様と実装の不一致

25. Swagger + GrapeでAPIドキュメント自動生成

26. 自動生成されたドキュメントの例 (Swagger UI)

27. Swagger
• RESTful APIの仕様を記述するための仕様
• API仕様をJSONで表現
• OpenAPI Initialiveでもベースの仕様として採用
• 仕様に準拠した便利なツール群
• Swagger UI
• Swagger Editor
• Swagger Codegen
http://swagger.io/

28. Grape
• RESTful APIを実装するためのフレームワーク(Ruby)
• RackとしてRailsにmountして利用可能
• 強力なDSLで仕様と実装の同期コストが少なくて済む
• 実装になるだけでなく、ドキュメントとしても機能
• DSLからドキュメント(HTML)を自動生成できる
• grape-swaggerと組み合わせることで、DSLから
Swaggerに準拠したJSONを自動生成できる
http://www.ruby-grape.org/

29. DSL

30. Swagger + Grapeの運用イメージ
APサーバ
GET /api/swagger_doc.json
DeployAPIドキュメント参照
アプリ開発メンバー API開発メンバー
Swagger UI

31. Swagger + Grapeの効果
• APIドキュメント管理コストの削減
• 本来の開発に集中できるように
• 課題もある
• 単純な入出力の仕様だけ記述しても、APIを呼び出す
ための情報としては不十分。descriptionに書くべき情
報が重要になる。
• (脱線) モバイルファーストな環境でRESTは幸せな選
択肢なのか？gRPCなどにも興味がある。

32. Swagger Editorを利用したサービス連携の調整
API Gateway
Lambda
API Gateway経由で
grapeのAPIを実行したい
ガラパゴス クライアント
仕様調整

33. Swagger から API Gateway Endpoint自動生成
API Gateway
Lambda
Swagger Editor経由
Swagger YAMLを共有
仕様調整
Swagger Editorガラパゴス クライアント
Import
API Gateway経由で
grapeのAPIを実行したい

34. アプリ配布境界
サーバ
アプリ
アプリ配布境界
デザイン
API境界
デザイン境界
テスト

35. アプリ配布境界

36. 手抜きたぶん発表時間が足りないので手短に…
• CIの話です
• ビルドめんどくせえ問題
• ガラパゴスのCI体制
• iOS
• Jenkins + Fastlane
• Android
• GitLab CI (SDK on Docker)
• Rails
• GitLab CI (RSpec on Docker), Jenkins (Deploy)
• 今さら感のあるCIを話をここで出した理由…

37. GitLabすげえことになってんぞ！
• Omnibus版ならインストールも運用も簡単 (apt,yum)
• 必要にして十分な機能 (PullRequest,Issue,Snippet,…)
• GitLab CI
• Docker or ShellベースのCIツール
• Mac版のAgentもある
• Docker Private Registryの機能
• GitLabサイコー！

38. No more

39. https://www.glpgs.com/career/
最後に
境界問題も解決しながら
色々なサービス作りに携わりたい
エンジニアを絶賛大募集中！

40. 完