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
freee_biz_tech_20200205.pdf
Search
benzookapi
February 05, 2020
Technology
0
510
freee_biz_tech_20200205.pdf
benzookapi
February 05, 2020
Tweet
Share
More Decks by benzookapi
See All by benzookapi
技術をお金と貢献に変える、Shopifyテーマとアプリの開発
benzookapi
1
2.1k
Shopify Storefront APIを使った PWA e-commerceの解説とデモ
benzookapi
0
610
DevRel for tech. entrepreneurs: Beyond platform partners
benzookapi
0
170
Shopifyを使ったヘッドレスコマースの 実現方法と事例
benzookapi
0
210
React + GraphQL を使ったShopify Appの作り方と そのマネタイズ方法
benzookapi
1
1.3k
Shopifyアプリエコシステムで始める 第3のスキルマネタイズ
benzookapi
0
4.3k
Tech. Blog TIPS
benzookapi
0
310
Our new DevRel: Invention of scaling out partner ecosystem
benzookapi
0
290
WordPressとShopifyでECサイトを作ろう
benzookapi
0
1.1k
Other Decks in Technology
See All in Technology
改竄して学ぶコンテナサプライチェーンセキュリティ ~コンテナイメージの完全性を目指して~/tampering-container-supplychain-security
mochizuki875
1
360
組織の“見えない壁”を越えよ!エンタープライズシフトに必須な3つのPMの「在り方」変革 #pmconf2025
masakazu178
1
590
JavaScript パーサーに using 対応をする過程で与えたエコシステムへの影響
baseballyama
1
110
入社したばかりでもできる、 アクセシビリティ改善の第一歩
unachang113
2
340
単一Kubernetesクラスタで実現する AI/ML 向けクラウドサービス
pfn
PRO
1
340
pmconf 2025 大阪「生成AI時代に未来を切り開くためのプロダクト戦略:圧倒的生産性を実現するためのプロダクトサイクロン」 / The Product Cyclone for Outstanding Productivity
yamamuteki
3
1.9k
Dev Containers と Skaffold で実現する クラウドネイティブ開発環境 ローカルのみという制約に挑む / Cloud-Native Development with Dev Containers and Skaffold: Tackling the Local-Only Constraint
bitkey
PRO
0
120
レガシーシステム刷新における TypeSpec スキーマ駆動開発のすゝめ
tsukuha
0
230
[CV勉強会@関東 ICCV2025] WoTE: End-to-End Driving with Online Trajectory Evaluation via BEV World Model
shinkyoto
0
290
国産クラウドを支える設計とチームの変遷 “技術・組織・ミッション”
kazeburo
4
5.8k
大規模モノレポの秩序管理 失速しない多言語化フロントエンドの運用 / JSConf JP 2025
shoota
0
290
OSだってコンテナしたい❗Image Modeが切り拓くLinux OS運用の新時代
tsukaman
0
110
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
225
10k
Six Lessons from altMBA
skipperchong
29
4.1k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.3k
Agile that works and the tools we love
rasmusluckow
331
21k
Designing for Performance
lara
610
69k
How to Ace a Technical Interview
jacobian
280
24k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.8k
Unsuck your backbone
ammeep
671
58k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.3k
The Invisible Side of Design
smashingmag
302
51k
Building a Modern Day E-commerce SEO Strategy
aleyda
45
8.1k
Transcript
ˏ freee Biz Tech Frontier 2020 άϩʔόϧίϚʔεϓϥοτϑΥʔϜͷ APIΤίγεςϜ
• Junichi Okamura, Technical Partner Manager at Shopify • @benzookapi
• API Lover/Midnight Developer/MANGA Creator/Beer Lover/App Hacker Who am I?
• ShopifyͱͦͷΤίγεςϜͷ֓ཁ • ShopifyͷΦʔϓϯͳٕज़ج൫ʹ͍ͭͯ • ͳͥΤίγεςϜ͕ඞཁͳͷ͔ʁ • ΞϓϦAPIɺύʔτφʔͷॏཁੑ • Shopify
APIͱfreee APIΛͬͨέʔεελσΟ • ·ͱΊʢٕज़ΤίγεςϜͷಈʣ ຊ͓͍ͨ͜͠͠ͱ
Make Commerce Better For Everyone
ShopifyΫϥυϕʔεͷΦϜχνϟωϧΛ࣮ݱͨ͠ϓϥοτϑΥʔϜͰ͢ɻ ݸਓͷํ͔Βେاۀ·Ͱ҆৺ͯ͠͝ར༻͍͚ͨͩ·͢ɻ 2006 Shopifyϩʔϯν $1,073M ؒརӹֹ (աڈ12ϱ݄) 2,900+ ΞϓϦετΞʹެ։͞Ε͍ͯΔΞϓϦͷ $100B
ࣄۀऀ༷ͷ૯ྲྀ௨ֹ (ྦྷܭ) 2.1 million ϢχʔΫͷετΞΞΧϯτ 1,000,000+ ళฮ —— ~175ϱࠃ 4,000+ ࣾһ 22,000 աڈ12Χ݄ͷؒͰ1ళฮҎ্ͷShopifyετΞΛ ϦϦʔεͨ͠ύʔτφʔͷ
؆୯ʹݴ͏ͱɾɾ ͓ᔬམͳετΞΛ؆୯ʹ࡞ΕΔϓϥοτϑΥʔϜʢʴ͍ΖΜͳͱ͜ΖͰൢചՄೳʣ
ShopifyύʔτφʔΤίγεςϜ Ϛʔνϟϯτ͕ αʔυύʔςΟʔ ΞϓϦΛར༻ 80%+ ύʔτφʔ͔Βͷհ Ϛʔνϟϯτ 200,000+ Shopifyύʔτφʔ͕ಘͨऩӹ 1,320ԯԁ
(2018) ΞϓϦ։ൃύʔτφʔ͕ ಘͨऩӹ 200ԯԁ (2018)
2,900+ ެ։͞Ε͍ͯΔAPIͰࣗ༝ʹΧελϚΠζΞϓϦͷ࡞͕Մೳ ച্Ξοϓ ૹ ࡏݿཧ ސ٬ཧ ࡒɾձܭ ଟݴޠɾଟ௨՟ Ϩϙʔτ ιʔγϟϧ
ϚʔέςΟϯά Shopify ΞϓϦετΞ https://apps.shopify.com/?locale=ja
Shopify ςʔϚετΞ 100छྨҎ্ͷσβΠϯςϯϓϨʔτ https://themes.shopify.com
͓ɾɾɾʁ
Shopifyͷٕज़ج൫
ΞϓϦͷߏ Partner Server App Bridge (page) App Bridge (Action) Admin
API Storefront API Polaris (UI) Webhook Webhook App Bridge (POS) API calls
App Bridgeͱʁ ShopifyʹΞϓϦΛຒΊࠐΉͨΊͷJavascriptϥΠϒϥϦʢPOSΞϓϦʹରԠʣ
Polarisͱʁ ShopifyϚʔνϟϯτʹ࠷దͳUXΛఏڙ͢ΔͨΊͷCSSʢReact ʣϥΠϒϥϦʢOSSʣ
Webhookͱʁ Shopifyͷσʔλߋ৽ͷΠϕϯτΛ௨ͯ͘͠ΕΔػೳʢAPIΛݺͼग़͢͜ͱՄೳʣ ※ʮઃఆʯ> ʮ௨ʯ > ʮWebhookʯ ͔ΒઃఆͰ͖·͢ Webhookͱ
ଟ͘ͷπʔϧίϯϙʔωϯτOSSͱͯ͠ఏڙ
ͦͯ͠؊৺ͳAPIɾɾɾ αʔόʔαΠυͷGraphQLͱRESTͷ΄͔ɺϑϩϯτ༻ͷAjax API༻ҙ GraphQL REST Ajax
؆୯ʹShopify APIΛࢼ͢ํ๏ GraphQL App (GraphQLͷίʔυαδΣετػೳͱ εΩʔϚࣙॻ͋Γʣ Private App ʢτʔΫϯͳ͠ͷBasicೝূͰAPI͕ݺΔͷͰ RESTΛςετ͍͢͠ʣ
ͪͳΈʹ؆୯ʹfreee APIΛࢼ͢ํ๏ɾɾɾ Swagger UI (σϕϩούʔαΠτͰͦͷ··ݺͼग़ͤΔ)
͜ΕΒͷΦʔϓϯͳٕज़ج൫ͰͨΒ͞ΕΔͷ • ωΠςΟϒʹ͍֦ۙுੑͷߴ͍ΞϓϦͷ։ൃ • ॊೈͳAPIʹΑΔ։ൃऀͷΠϯεϐϨʔγϣϯ • APIΛิڧ͢ΔػೳʹΑΔ෯͍ΧελϚΠζ
ͦΜͳShopifyͷΞϓϦ։ൃʹڵຯΛ࣋ͨΕͨํɾɾɾ ຊޠϒϩάͷαϚϦʔϖʔδΛ͝ཡ͍ͩ͘͞ʂ ShopifyΞϓϦͷ։ൃํ๏ɹɹɹɹɹɹɹɹɹɹɹɹɹɹ
ΤίγεςϜͷॏཁੑ
ͳͥΤίγεςϜ͕ॏཁ͔ ίϚʔεͱ͍͏ෳࡶͳχʔζʹਖ਼͘͠ਝʹରԠ͠ɺΈΜͳΛϋοϐʔʹ͢ΔͨΊ
ΤίγεςϜͱ͍͏ଆ໘ͰShopifyΛఆٛͯ͠ΈΔͱɾɾɾ • Shopify = Commerce OS (by App) • Shopify
= Headless commerce (by API/SDK) • Shopify = Hybrid cloud in OSS approachʢby partners)
ʢҰݴͰݴ͏ͱʣ͜͏ͳΒͳ͍ͨΊ
ΞϓϦΛ͏ϝϦοτͱͳʹ͔ʁ ʹػೳͷՃ͚ͩͰͳ͘ɺߋ৽ͱআ͕Ͱ͖ΔʢTry & Error͕Ͱ͖Δʣ Ճɾߋ৽ আ ※ΞϓϦػೳͷ͚͚ͩ͠ͷಓ۩Ͱͳ͍
APISDKΛ͏ϝϦοτͱͳʹ͔ʁ ʹχʔζʹԠͨ͡ॊೈͳઃܭ͕Ͱ͖Δʢಉ͡ΧςΰϦʹόϦΤʔγϣϯ͕ੜ·ΕΔʣ ※API࡞͚ͬͨͩͰҙຯ͕ͳ͘ɺ࿈ܞ͚͕ͩ༻్Ͱͳ͍
ύʔτφʔΛר͖ࠐΉϝϦοτͱͳʹ͔ʁ ʹϓϥοτϑΥʔϜΛར༻͢Δશͯͷਓͷޭʹͭͳ͕Δʢ࣋ଓՄೳͳΤίγεςϜʣ ※֎෦ύʔτφʔϦιʔεͰͳ͍
ΤίγεςϜͱ ຬ͖ٕͨ͢ज़ͱͦΕΛϏδωεʹੜ͔ͤΔΈ͕͋ͬͯॳΊͯΓཱͭͷ
ɹShopifyͱfreeeͰͷέʔεελσΟ
͓ᶃɿShopifyͱfreeeΛ࿈ܞ͢Δ߹ͷ༷ ҎԼͷ༷ͷͲͪΒ͕ద͔ʁ A. WebhookΛઃఆͯ͠จ͕ೖΔͨͼʹfreeeͷAPIΛݺΜͰऔҾొ ͢Δ B. औΓࠐΈϘλϯΛ࡞ͬͯShopifyͷAPIͰจσʔλΛҾ͍ͯfreeeͷ APIͰऔҾొ͢Δ
͓ᶄɿShopifyͱfreeeΛ࿈ܞ͢Δ߹ͷνΣοΫ ҎԼͷνΣοΫͲͪΒ͕ΑΓద͔ʁ A. ೋॏऔΓࠐΈ͠ͳ͍Α͏ʹऔΓࠐΈࡁΈσʔλΛfreee APIͰଘࡏ֬ ೝ͢ΔॲཧΛೖΕΔ B. ೋॏऔΓࠐΈ͠ͳ͍Α͏ʹShopify APIΛͬͯऔΓࠐΈࡁΈ͔Ͳ͏ ͔ͷϑϥάΛσʔλʹೖΕΔ
͓ᶅɿShopifyͱfreeeΛ࿈ܞ͢Δ߹ͷঝೝϓϩηε ҎԼͷϓϩηεͲͪΒ͕ΑΓద͔ʁ A. ͡ΊʹShopifyΞϓϦͷΠϯετʔϧը໘ͰShopify OAuthͷঝೝ Λऔͬͯɺͦͷޙ freeeͷϦμΠϨΫτͰfreee OAuthͷঝೝΛऔΔ B. ͡ΊʹfreeeͷϦμΠϨΫτͰfreee
OAuthͷঝೝΛऔͬͯɺͦͷ ޙShopifyΞϓϦͷΠϯετʔϧը໘ͰShopify OAuthͷঝೝΛऔΔ
͑ɿ ͲͪΒͰྑ͍ʢ͋ͳͨ࣍ୈʣ
ɹ·ͱΊ
ΤίγεςϜͱ͍͏ΞϓϩʔνࠓޙͲ͏ͳΔ͔ʁ =ଟ༷Խ͢ΔੈքͰϓϥοτϗʔϜΛ࡞Δखஈͱͯ͠ओྲྀʹͳΔͱࢥΘΕΔ • ୠ͠ɺҎԼͷΛߟྀ͢Δඞཁ͕͋Δ • =>ݸผχʔζ࿈ܞͷඞཁ͕ຊʹ͋Δ͔ • =>൚༻తͳΠϯλʔϑΣʔεʢAPISDKʣΛఏڙͰ͖Δ͔ • =>ϝϦοτΛڗडͰ͖ΔίϛϡχςΟ͕ੜ͞ΕΔ͔
ͦͯ͠ΤίγεςϜͷओɺ ٕज़Λѻ͑Δ͋ͳͨͰ͢ʂ
ˏ freee Biz Tech Frontier 2020 Thank you!