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
Shopifyを使ったヘッドレスコマースの 実現方法と事例
Search
benzookapi
May 20, 2021
Technology
0
200
Shopifyを使ったヘッドレスコマースの 実現方法と事例
https://shopify-uc-kansai-3.peatix.com/
benzookapi
May 20, 2021
Tweet
Share
More Decks by benzookapi
See All by benzookapi
技術をお金と貢献に変える、Shopifyテーマとアプリの開発
benzookapi
1
2.1k
Shopify Storefront APIを使った PWA e-commerceの解説とデモ
benzookapi
0
600
DevRel for tech. entrepreneurs: Beyond platform partners
benzookapi
0
160
React + GraphQL を使ったShopify Appの作り方と そのマネタイズ方法
benzookapi
1
1.3k
Shopifyアプリエコシステムで始める 第3のスキルマネタイズ
benzookapi
0
4.3k
Tech. Blog TIPS
benzookapi
0
290
Our new DevRel: Invention of scaling out partner ecosystem
benzookapi
0
290
WordPressとShopifyでECサイトを作ろう
benzookapi
0
1.1k
AWS EventBridgeを活用したShopifyアプリの サーバーレス開発
benzookapi
0
2k
Other Decks in Technology
See All in Technology
BtoBプロダクト開発の深層
16bitidol
0
140
DataOpsNight#8_Terragruntを用いたスケーラブルなSnowflakeインフラ管理
roki18d
1
300
“2件同時配達”の開発舞台裏 〜出前館PMが挑んだダブルピック実現に向けた体験設計〜
demaecan
0
160
PyCon JP 2025 DAY1 「Hello, satellite data! ~Pythonではじめる衛星データ解析~」
ra0kley
0
830
GC25 Recap+: Advancing Go Garbage Collection with Green Tea
logica0419
1
310
業務自動化プラットフォーム Google Agentspace に入門してみる #devio2025
maroon1st
0
170
5年間のFintech × Rails実践に学ぶ - 基本に忠実な運用で築く高信頼性システム / 5 Years Fintech Rails Retrospective
ohbarye
9
3.6k
Function calling機能をPLaMo2に実装するには / PFN LLMセミナー
pfn
PRO
0
750
それでも私はContextに値を詰めたい | Go Conference 2025 / go conference 2025 fill context
budougumi0617
4
930
Trust as Infrastructure
bcantrill
0
230
stupid jj tricks
indirect
0
7.6k
生成AIを活用したZennの取り組み事例
ryosukeigarashi
0
180
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
Learning to Love Humans: Emotional Interface Design
aarron
274
40k
Intergalactic Javascript Robots from Outer Space
tanoku
273
27k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
30
9.7k
Java REST API Framework Comparison - PWX 2021
mraible
33
8.8k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Rails Girls Zürich Keynote
gr2m
95
14k
GraphQLの誤解/rethinking-graphql
sonatard
72
11k
Automating Front-end Workflow
addyosmani
1371
200k
The Cost Of JavaScript in 2023
addyosmani
53
9k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Transcript
ShopifyΛͬͨϔουϨείϚʔεͷ ࣮ݱํ๏ͱࣄྫ 2021.5.20 @ Shopify UC Kansai # 3 Junichi
Okamura
• Junichi Okamura, Sr. Technical Partner Manager at Shopif y
• @benzookap i • API Lover/Midnight Developer/MANGA Creator/Beer Lover/App Hacker Who am I?
ϔουϨείϚʔεͷ֓ཁͱࣄྫ 01 ຊͷ༰ 02 ShopifyͱΞϓϦΤίγεςϜͷ֓ཁ 03 ϔουϨείϚʔεͷ࣮ݱํ๏ 04 Storefront APIͱൢചνϟωϧͷؔ
05 ຊͷࣄྫͱσϞɺ·ͱΊ 06 ShopifyΞϓϦ։ൃͷֶशํ๏
4 ShopifyʢγϣοϐϑΝΠʣʹ͍ͭͯ
ShopifyΫϥυϕʔεͷίϚʔεϓϥοτϑΥʔϜͰ͢ɻݸਓͷํ͔Βେ اۀ·Ͱ҆৺ͯ͠͝ར༻͍͚ͨͩ·͢ɻ 200 6 Shopify ϩʔϯν $2,9B ऩӹֹ (աڈ12ϱ݄ )
6,000 + ΞϓϦετΞʹެ։͞Ε͍ͯΔΞϓϦͷ $277B ࣄۀऀ༷ͷGMV (ྦྷܭ ) 4.9 millio n ళฮͷελοϑΞΧϯτ 1,700,000+ ళฮ — — 175ϱࠃ ~ 7,000 + ࣾһ Shopifyʹ͍ͭͯ શϦϞʔτԽ Digital by defaultͷͱ2020·ͰΦϑΟεΛશΫϩʔζ
ϚϧννϟωϧίϚʔεϓϥοτϑΥʔϜ
ShopifyൢചʹඞཁͳશͯΛαϙʔτ σβΠϯ ϗετ ܾࡁ SEO ੳ σʔλ ϓϥΠόγʔ ड υϝΠϯ
ετΞ࡞ όοΫΤϯυ ϚʔέςΟϯά ҆શੑ ϒϩά
൚༻ੑ͕ߴࣗ͘༝ͷߴ͍ΧελϚΠζ͕Մೳ ෳ։ൃݴޠͰࣗ༝ͳΧελϚΠζΛՄೳͱ͢Δ๛ͳAPI Access APIs Inventory APIs Product APIs Analytics APIs
MarketingEvent Sales channel APIs Billing APIs Metafield Shipping and fulfillment APIs Customer APIs Online store APIs Shopify Payments APIs Discount APIs Order APIs Store property APIs Event APIs Plus APIs TenderTransaction
9 ShopifyͷΞϓϦΤίγεςϜ
10 ShopifyΞϓϦετΞͱύʔτφʔϓϩάϥϜ ֦େ͢Δ ΤίγεςϜ
11 ຊͰΞϓϦΤίγεςϜٸ֦େ ຊಛԽ ֦େ͢Δ ΤίγεςϜ
12 ΞϓϦ։ൃͷୈҰาɿύʔτφʔొ ֦େ͢Δ ΤίγεςϜ
13 ϔουϨείϚʔεͱ
14 όοΫΤϯυͱϑϩϯτΤϯυ͕Γ͞ΕͨίϚʔε Backend Frontend ఆٛ
15 ShopifyϒϩάɿίΞϥϚοτϨε Shopify ϔουϨείϚʔε ࣄྫ
16 • ൢ࿏ʢൢചνϟωϧʣ͕͕ΔʢϞʔϧग़ళɺళฮʣ • ετΞϑϩϯτΛ࠷దԽͰ͖ΔʢPWAɺϞόΠϧΞϓϦʣ • طଘࢿ࢈Λྲྀ༻Ͱ͖ΔʢCMSɺࣗࣾ։ൃγεςϜʣ ϔουϨείϚʔεͷԿ͕خ͍͔͠ʁ ϝϦοτ
17 • ։ൃྗͱࢿ͕ඞཁʢΤϯδχΞɺΠϯϑϥʣ • ϓϥοτϑΥʔϜͷै͕ඞཁʢAPIͷ༷มߋɺഇࢭʣ • ذͷޙୀʢোόάରԠͷ૿Ճʣ ϔουϨείϚʔεͷԿ͕ࠔΔ͔ʁ σϝϦοτ
18 • ϔουίϚʔεͩͱͳΜͰͰ͖ΔʢܾࡁΛࣗ༝ʹ͍͡ΕΔ ͳͲʣ • ϔουϨείϚʔεͩͱૣ͘ͳΔʢඞͣඪ४ςϯϓϨʔτΑ Γૣ͘ͳΔͳͲʣ • ϔουϨείϚʔεͷํ͕Ṷ͔Δʢඞͣߪങ͕͕͋Δͳ Ͳʣ
ϔουϨείϚʔεͷաͳظ શͯؒҧ͍Ͱ͢ʂ Α͋͘Δޡղ
19 ಛʹܾࡁཁҙʂ Shopify͕ఏڙ͢ΔܾࡁػೳҎ֎Λ ಠࣗʹ࣮͢Δ͜ͱʢಛผʹڐ Մ͞ΕͨҰ෦ͷύʔτφʔΛআ ͖ʣنͰېࢭ͞Ε͍ͯ·͢ɻ ʢޙड़ʣ ཧ༝ɿ ϚʔνϟϯτͷηΩϡϦςΟ ΛकΔͨΊ
ؾΛ͚ͭΔ ͜ͱ
20 ϔουϨείϚʔεͷ࣮ݱํ๏
21 Shopify Storefront API Shopify Storefront API API
22 Shopify JavaScript Buy SDK Shopify Buy SDK SDK
23 Shopify BuyButton.js Shopify Buy Button JS JavaScript
24 Shopify Buy Button Channel Shopify Buy Button ൢചνϟωϧΞϓϦ ΞϓϦ
25 Storefront APIͱൢചνϟωϧͷؔ
26 ൢചνϟωϧͱʁ ඪ४Ͱ͍͍ͭͯΔΦ ϯϥΠϯετΞ࣮ ൢചνϟωϧʢফ ͨ͠Γ༗ޮʹͨ͠Γ ͕Մೳʣ Πϯετʔϧͨ͠ޙʹShopifyͷཧ ը໘ͷࠨଆͷϝχϡʔʹग़ͯ͘Δ ͷ͕ൢചνϟωϧʹStorefront
APIΛ ͍ͬͯΔՄೳੑ͕͋Δͷ ֓ཁ
27 Storefront APIͱͷؔ ެ։ΞϓϦͰStorefront APIΛ͏ʹ ඞͣΞϓϦΛൢചνϟωϧʹ͢Δ ʢ*1ʣඞཁ͋Γʢ৹͕ࠪೖΓ·͢ʂʣ ετΞϑϩϯτΛ࡞Δʹ ৽͍͠ൢ࿏։ͱͷղऍ
֓ཁ *1 ൢചνϟωϧʹඞͣStorefront APIΛ͏ͷͰͳ͍
28 Payment APIʢܾࡁ࣮ʣͱͷؔ ൢചνϟωϧ͕ڐՄ͞Εͨޙʹ͞Βʹ ผͷ৹͕ࠪඞཁͰ͢ʢ௨ৗPCIDSS ͳͲΛอ༗͢ΔܾࡁձࣾͳͲ͔͠ڐՄ ͞Ε·ͤΜʣ ※͜ΕΒͷυΩϡϝϯτΛݟͯࣗ༝ʹ֎ ෦ܾࡁձࣾͷॲཧΛར༻Ͱ͖Δͱߟ͑Δ ํ͕͍·͕͢ɺͦ͏Ͱ͋Γ·ͤΜʢܾ
ࡁॲཧShopify͕ରԠ͍ͯ͠Δάϩʔό ϧͳͷ͔͑͠·ͤΜʣ ֓ཁ
29 ΞϓϦͷछྨͱػೳͷؔ ɹɹɹɹɹΞϓϦͷछྨ ػೳ ެ։ΞϓϦ ΧελϜΞϓϦ ϓϥΠϕʔτΞϓϦ ୭͕࡞Δʁ ύʔτφʔ ύʔτφʔ
Ϛʔνϟϯτ ୭͕͑Δʁ ΞϓϦετΞ͔ΒશϚʔ νϟϯτ ύʔτφʔ͕ڐՄͨ̍͠ ͭͷϚʔνϟϯτʢ*1ʣ ΞϓϦΛ࡞ͬͨ̍ͭͷ Ϛʔνϟϯτ ৹ࠪඞཁ͔ʁ ඞཁʢެ։ਃ͕௨Βͳ ͍ͱ͑ͳ͍ʣ ෆཁʢͨͩ͠نνΣο Ϋ͋Γʣ ෆཁʢͨͩ͠نνΣο Ϋ͋Γʣ ൢചνϟωϧʹͰ͖Δ ͔ʁ Ͱ͖Δʢެ։ਃҎલʹ ผͷ৹ࠪඞཁʣ Ͱ͖ͳ͍ Ͱ͖ͳ͍ Storefront API͑Δ ͔ʁ ͑ΔʢൢചνϟωϧԽ ඞਢʣ ͑ͳ͍ ͑Δʢཧը໘͔Β τʔΫϯੜʣ Payment API͑Δ ͔ʁ ʢ΄ͱΜͲͷ߹ʣ͑ ͳ͍ʢݸผ৹ࠪඞཁʣ ͑ͳ͍ ͑ͳ͍ *1 Shopify PlusͷΈෳϚʔνϟϯτՄ ৄࡉ
30 ຊͷࣄྫͱσϞ
31 ϞόΠϧΞϓϦδΣωϨʔλʔ͕Strefront API࠾༻ ຊͷࣄྫ
32 Storefront API one pager demo σϞ
33 • ಄ͷ෦Λ։ൃͯ͠ϢʔεέʔεΛ͛Δͷ • ϝϦοτɾσϝϦοτ྆ํ͋Δਕͷ • ౿ΈࠐΉલʹຊʹͦΕ͕ϕετ͔ࣗ͠Α͏ ϔουϨείϚʔεͱ ·ͱΊ
34 ShopifyΞϓϦ։ൃͷֶशํ๏
35 Shopifyϒϩά Shopify ΞϓϦ։ൃ ΞϓϦ։ൃͱ ެ։
36 Shopify ΦϯϥΠϯίϛϡχςΟʢϑΥʔϥϜʣ Shopify ϑΥʔϥϜ ࣭ ΞΠσΟΞ
37 Shopify ύʔτφʔFacebookάϧʔϓ ※ࢀՃʹύʔτφʔΞΧϯτ͕ඞཁͰ͢ ύʔτφʔ ಉ࢜ͷަྲྀ
None