Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ZOZOTOWNの裏側に迫る! Javaで作られたBFFの開発事例を紹介
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Yutaro Ogawa
March 27, 2023
Technology
3.1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ZOZOTOWNの裏側に迫る! Javaで作られたBFFの開発事例を紹介
Yutaro Ogawa
March 27, 2023
Other Decks in Technology
See All in Technology
AIが当たり前の組織で エンジニアはどう育つか
nishihira
1
990
複数プロダクトで進めるAI機能実装 ── 実践から得たリアルな学びとロードマップ実現への挑戦 / AICon2026_yanari
rakus_dev
1
270
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
15
110k
GoでCコンパイラを作った話
repunit
0
150
Playwright × AI Agent でE2Eテストはどう変わるか AI駆動テストの可能性と実用検証の結果
taiga7543
2
810
生成 AI 時代にいま一度「問い合わせ」について考えてみる
kazzpapa3
1
130
なぜ、あなたのAPIは使われないのか? AX時代の設計原則、ガードレール、運用体制
yokawasa
1
210
発表と総括 / Presentations and Summary
ks91
PRO
0
190
第67回コンピュータビジョン勉強会CVPR2026読会前編
tsukamotokenji
0
170
ダッシュボード"開発"について 〜使われるダッシュボードのつくりかた〜
kimichan
0
200
Power Automateアップデート情報
miyakemito
0
100
どこまでAIに任せるか 〜確率論と決定論の境界決定〜
shukob
0
460
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
450
<Decoding/> the Language of Devs - We Love SEO 2024
nikkihalliwell
1
280
A better future with KSS
kneath
240
18k
A designer walks into a library…
pauljervisheath
211
24k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
How to Think Like a Performance Engineer
csswizardry
28
2.7k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6k
Agile Actions for Facilitating Distributed Teams - ADO2019
mkilby
0
220
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
10k
Transcript
ZOZOTOWNの裏側に迫る! Javaで作られたBFFの開発事例を紹介 2023-03-23 ZOZO Tech Meetup〜Java活用事例紹介〜 株式会社ZOZO ZOZOTOWN開発本部 ZOZOTOWNWEB部 バックエンド1ブロック
小川 雄太郎 Copyright © ZOZO, Inc. 1
© ZOZO, Inc. 2 小川 雄太郎(ゆうたろう) 経歴 2021年、株式会社ZOZO(旧:株式会社ZOZOテクノロジーズ)に新卒入社し、現在は ZOZOTOWN開発本部ZOZOTOWNWEB部バックエンド1ブロックに在籍中。
近況 VBScriptで書かれた既存のZOZOTOWNの運用・保守を行いつつ、Javaのフレームワークであ るSpringBootを利用した新しいZOZOTOWNへのリプレイスを進行中。 主に、BFFアーキテクチャに基づいて構築されたAPIの開発に着手している。 GitHub Twitter
© ZOZO, Inc. アジェンダ • BFFの概要説明 • BFFのプロジェクトの構成や設計について • 直近での利用例
• まとめ 3
© ZOZO, Inc. 4 BFFの概要説明
© ZOZO, Inc. 5 BFF(Backends for Frontends)とは BFFとは、Backends for Frontendsの略で、UIやユースケースに合わせてデータの加工をおこなう中間層の
こと。WebやモバイルアプリケーションなどのUIと各マイクロサービス間のやりとりを仲介し、UIの要件に合わ せたデータ整形や集約を担当する。
© ZOZO, Inc. リプレイス開始前 • 全てのロジックをWebサーバとストアドで保持 • ClassicASPやVBScript、独自に開発したライブラリなどを利用して開発 • オンプレミス環境でIISを使用して稼働
6 ZOZOTOWNのリプレイス①
© ZOZO, Inc. 7 ZOZOTOWNのリプレイス② リプレイス開始当初 • 一部のストアドで保持していたロジックをAPI化 • クラウド環境でコンテナによってマイクロサービスを実行
• DB内の一部のデータをクラウドに同期
© ZOZO, Inc. 8 ZOZOTOWNのリプレイス③ 現在 • レンダリングを目的とした新たなWebサーバを構築し、一部のフロントエンド領域をリプレイス • データの整形や集約を担当するBFFサーバを構築
• 現在、3つのアーキテクチャが共存している
© ZOZO, Inc. 9 BFF導入によるメリット • クライアントの実装が簡潔になる • クライアント・サーバ間の通信量を削減できる •
マイクロサービス側の変更によるクライアントへの影響が減少する • アプリケーションを分離することで責務が明確になり、開発効率の向上が期待できる
© ZOZO, Inc. 10 BFFのプロジェクトの構成や設計について
© ZOZO, Inc. 11 DDDアーキテクチャの採用とレイヤー分担 ZOZOTOWNにおけるBFFはDDD(Domain-Driven Design)に基づいたアーキテクチャを採用しており、各レイ ヤーの役割分担が明確になっている。
© ZOZO, Inc. 12 • プログラム言語 ◦ Java ◦ Groovy
• フレームワーク ◦ Spring Boot • ライブラリ ◦ Lombok • テストフレームワーク ◦ Spock • ビルドツール ◦ Gradle • API仕様 ◦ OpenAPI • モック用Webサーバ ◦ nginx • ツール ◦ OpenAPI Generator etc. 技術スタック
© ZOZO, Inc. 13 直近での利用例
© ZOZO, Inc. 14 ZOZOTOWN ホーム elove by ZOZO (エラブ
バイ ゾゾ) ページ上部に表示されるバ ナー一覧、およびページ中 央に表示されるパーソナライ ズされたモジュール一覧を BFFを介してデータ取得して いる。 CMSを利用した施策ペー ジ。ページング機能を搭載し た記事一覧のモジュールを BFFを介してデータ取得して いる。 https://zozo.jp/ https://zozo.jp/elove/
© ZOZO, Inc. • 現在ZOZOTOWNでは、VBScriptで実装されたレガシーなアプリケーションをJavaやSpringBootを用いた モダンなアプリケーションへとリプレイスしている。 • BFFの導入により、複数のマイクロサービスから必要なデータを収集し、一つのエンドポイントからレスポ ンスを返すことができるようになった。 •
BFFの導入により、クライアント側の実装が簡素化され、通信量も削減された。また、クライアント側がマ イクロサービス側の変更に影響を受けずにBFF側で修正を完結できるため、今後の開発効率の向上も 見込める。 • BFFへのリプレイスは現在進行中で、まだ一部のみの実施となっている。今後も随時リプレイスを進め、 全体の更新を目指している。 15 まとめ
© ZOZO, Inc. 16 BFFを駆使したZOZOTOWNのバックエンド開発に携わりませんか? 募集職種名 ZOZOTOWN バックエンドエンジニア 業務内容
ファッションEC「ZOZOTOWN」の新規機能から既存機能のバックエンド分野の開発 ◦ Webアプリケーションの設計/開発/運用 ◦ ネイティブアプリ用のAPIの設計/開発/運用 ◦ DBまわりのテーブル設計やチューニング 備考 ◦ フルフレックス制 ◦ 全国どこでも勤務可能
None