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
140
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
1.9k
Shopify Storefront APIを使った PWA e-commerceの解説とデモ
benzookapi
0
400
DevRel for tech. entrepreneurs: Beyond platform partners
benzookapi
0
110
React + GraphQL を使ったShopify Appの作り方と そのマネタイズ方法
benzookapi
1
1.2k
Shopifyアプリエコシステムで始める 第3のスキルマネタイズ
benzookapi
0
4k
Tech. Blog TIPS
benzookapi
0
250
Our new DevRel: Invention of scaling out partner ecosystem
benzookapi
0
240
WordPressとShopifyでECサイトを作ろう
benzookapi
0
1k
AWS EventBridgeを活用したShopifyアプリの サーバーレス開発
benzookapi
0
1.8k
Other Decks in Technology
See All in Technology
XPを始める新人に伝えたい近道の鍵
nakasho
1
260
AWSへのNIST SP800-171管理策 導入に向けての整備/20240930 Mitsutoshi Matsuo
shift_evolve
0
150
Vista FinderMx
jtes
0
160
Consoles, printk, Nested-NMIs_ Oh my!
ennael
PRO
0
160
AI時代のアジャイル開発(XP祭り2024版) / Agile Development in the AI Era in XPJUG
takaking22
13
3.4k
Perlで始めるeBPF: 自作Loaderの作り方 / Getting started with eBPF in Perl_How to create your own Loader
takehaya
1
180
Pythonを活用したLLMによる構造的データ生成の手法と実践
brainpadpr
3
230
【ログ分析勉強会】EDR ログで内部不正を検出できるのか、Copilot に聞いてみた
hssh2_bin
2
270
Hazard pointers with reference counter
ennael
PRO
0
110
Oracle Database 23ai 新機能#4 Real Application Clusters
oracle4engineer
PRO
0
110
【shownet.conf_】ネットワークテストの最適化と利便性の追求
shownet
PRO
0
240
エムスリー全チーム紹介資料 / Introduction of M3 All Teams
m3_engineering
1
210
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
6
220
What the flash - Photography Introduction
edds
67
11k
WebSockets: Embracing the real-time Web
robhawkes
59
7.3k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.5k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.1k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
26
4k
Designing with Data
zakiwarfel
98
5.1k
Automating Front-end Workflow
addyosmani
1365
200k
Fashionably flexible responsive web design (full day workshop)
malarkey
403
65k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
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