© 2023 Cookpad Inc. 生鮮 EC プラットフォームを 支えるサーバーアプリケーションたち 食べもの.dev #1 / 2023-04-26

© 2023 Cookpad Inc. 2 バックエンドエンジニア 開発リーダー / テックリード who? @mokuzon
 Motoi Okuzono
 職種 経歴 SNS 趣味 2016/08 クックパッド入社 社内情報共有ツール開発 2017/05 クックパッド料理教室 2019/07 クックパッドマート 販売者 2019/12 クックパッドマート 流通 2022/07 クックパッドマート EC @mokuzon
 オーケストラでホルンを吹く 飲酒

● クックパッドマートの紹介 ○ サービス内容 ○ 開発組織 ● クックパッドマートのサーバー小話 ○ プラットフォームならではの多彩なアプリケーション ■ それらを同じ Rails アプリケーションが提供している ○ 生鮮 EC ならではの話 ■ タイムセール ■ 食品情報の入稿 © 2023 Cookpad Inc. 3 Agenda

© 2023 Cookpad Inc. 4

© 2023 Cookpad Inc. 5 700+
 1000+


© 2023 Cookpad Inc. 6

© 2023 Cookpad Inc. 7

● 組織 ○ エンジニア 20 人（バックエンド、モバイル、ハードウェア） ○ デザイナ 5 人（UI、グラフィック） ○ その他 4 人（プロダクトマネージャー、コミュニティマネージャー） ● チーム ○ EC: ユーザーや販売者が触れるアプリケーション開発や、連続的なアプリケーション改善 ○ 流通: ユーザーが注文したものを届ける仕組みの開発 ○ 戦略: 大きな体験設計の見直しのための仕組み作りやプロトタイピンングと検証 ● 開発環境 ○ バックエンド: Ruby / Ruby on Rails ○ Webフロント: TypeScript / React, Next.js ○ iOS: Swift ○ Android: Kotlin ○ その他: Stripe, Firebase, KARTE, AWS, SORACOM (Canal, Gate, Lagoon, etc) © 2023 Cookpad Inc. 8 開発体制

© 2022 Cookpad Inc. 9 ● 対象 ○ 一般ユーザー ■ iOS モバイルアプリ ■ Android モバイルアプリ ■ Web (Next.js) ● 実装 ○ https://github.com/cookpad/garage で REST API を提供 ● 特徴 ○ User Facing かつトラフィックも当然一番多い ○ 生鮮 EC 特有の事情: タイムセールの負荷対策 ■ 以前は当番を決めて ECS と RDB の scale out をしていた ● クックパッドマートのプロダクト開発チームに On-Call を導入した話 https://techlife.cookpad.com/entry/introduce-mart-on-call ■ 今は push 通知のスロットリングでアクセスを分散 EC アプリケーションの API

© 2022 Cookpad Inc. 10 EC アプリケーションの API

© 2022 Cookpad Inc. 11 ● 対象 ○ 販売者 (toB) ● 実装 ○ Rails の view に一部 React component が乗る ● 特徴 ○ 入稿がメインなのでとにかくフォームが多い ■ 商品 ■ 営業日 ○ どんどん動的なページが増えているので、 Rails に React 乗せる 構成はやや辛くなりつつある ○ toB だと多少使いにくくても使ってもらえてしまう問題がある ○ 生鮮食品の入稿は品質情報など制約が多い ■ JSON Schema でフォームの必要事項を管理 ● JSON Schema をクックパッドマートの商品登録画面に導入した話 https://techlife.cookpad.com/entry/mart-json-schema 販売者向けの管理画面

© 2022 Cookpad Inc. 12 販売者向けの管理画面 { required: ["raw", "thawed", "farmed"], properties: { category_id: { const: "魚介加工品カテゴリの ID" }, thawed: { "$ref" => "#/definitions/thawed" }, farmed: { "$ref" => "#/definitions/farmed" }, raw: { "$ref" => "#/definitions/raw" }, }, dependencies: { thawed: { oneOf: [ { properties: { thawed: { const: true }, # 解凍品だった場合、消費期限 quality_guarantee: { "$ref" => "#/definitions/quality_guarantee/definitions/expiration" }, }, }, { properties: { thawed: { const: false }, # 非解凍品だった場合、保証消費期限 quality_guarantee: { "$ref" => "#/definitions/quality_guarantee/definitions/guarantee_expiration" }, }, }, ], }, }, }

© 2022 Cookpad Inc. 13 ● 対象 ○ ドライバー、庫内作業者 (toB) ● 実装 ○ GraphQL API を提供 / クライアントは Next.js ● 特徴 ○ 以前は iOS, Android のモバイルアプリケーションで提供していたが 変更頻度や開発体制の観点で web 化 ■ クックパッドマートのドライバー向け Webアプリケーション https://techlife.cookpad.com/entry/driver-web-app-in-cookpad-mart-2022 ○ 通知は使用者を Slack の Guest User にして解決 ○ 比較的最近生まれたので技術スタックが新しめ 流通業者向けアプリケーションの API

© 2022 Cookpad Inc. 14 ● クックパッドスタッフ向け admin ○ よくある管理画面 ● キッティング業者向け admin ○ ハードウェアをシステムに登録する機能だけを持った外部業者向け admin ● Bluetooth 印刷用モバイルアプリ API ○ 商品流通に専用のラベルプリンターを使っており その Bluetooth 版を扱うために 専用のモバイルアプリを Flutter で実装、それ向けの API ○ クックパッドマートにおける宣言的ラベル生成 https://techlife.cookpad.com/entry/2021/08/18/100000 他にもいろいろある

© 2023 Cookpad Inc. 15 サーバーの実装は基本的に一つの 大きな Rails アプリケーションのみ $ tree config/routes config/routes ├── admin.rb ├── api.rb ├── driver_shipping_support.rb ├── external_admin.rb ├── hub_worker_web.rb ├── print.rb ├── shop.rb ├── station_delivery_web.rb ├── station_maintainer_admin.rb ├── url_shortener.rb └── web.rb $ tree app/controllers -L 1 app/controllers ├── admin ├── api ├── application_controller.rb ├── concerns ├── driver_shipping_support ├── external_admin ├── hub_worker_web ├── print ├── shop ├── station_delivery_web ├── station_maintainer_admin ├── url_shortener └── web

© 2022 Cookpad Inc. 16 ● まだ早い ○ routing, controller は綺麗にわけられているが model や DB はまだまだ共通 ○ アプリケーションの境界はチームの境界と合わせるのがセオリー ■ これが新規事業や小さなチームではなかなか難しい ● 事業内容のピボット ● 流動的なチーム編成 ○ アプリケーション分割に大きく工数を割けるのはもっと事業が成長してから ● とはいえ ○ EC と流通、のように将来大きくなるとしたらこう分けるだろうという見立てはある ○ 同じアプリケーションでも新規の実装ではなるべく疎結合になるようには意識している ○ 新規に作成する model が EC と流通で共有することはない アプリケーションわけないの?

© 2022 Cookpad Inc. 17