React + GraphQL を使ったShopify Appの作り方と そのマネタイズ方法

https://nodejs.connpass.com/event/203464/

Transcript

1. React + GraphQL Λ࢖ͬͨShopify Appͷ࡞Γํͱ ͦͷϚωλΠζํ๏ 2021.2.25 @ NodeֶԂ 35࣌ݶ໨ ΦϯϥΠϯτϥΠΞϧ Junichi Okamura

2. • Junichi Okamura, Sr. Technical Partner Manager at Shopify • @benzookapi • API Lover/Midnight Developer/MANGA Creator/Beer Lover/App Hacker Who am I?
3. ShopifyΞϓϦ։ൃʹඞཁͳεΩϧ 01 ຊ೔ͷ͓୊ 02 ShopifyͱΞϓϦΤίγεςϜͷ֓ཁ 03 ShopifyΞϓϦ։ൃͷϚωλΠζ 04 ShopifyΞϓϦ։ൃͷֶशํ๏
4. 4 ShopifyʢγϣοϐϑΝΠʣʹ͍ͭͯ
5. Shopify͸Ϋϥ΢υϕʔεͷίϚʔεϓϥοτϑΥʔϜͰ͢ɻݸਓͷํ͔Βେ اۀ·Ͱ҆৺ͯ͠͝ར༻͍͚ͨͩ·͢ɻ 2006 Shopify ϩʔϯν $2,9B ऩӹֹ (աڈ12ϱ݄) 6,000+ ΞϓϦετΞʹެ։͞Ε͍ͯΔΞϓϦͷ਺ $277B ࣄۀऀ༷ͷGMV (ྦྷܭ) 4.9 million ళฮͷελοϑΞΧ΢ϯτ਺ 1,700,000+ ళฮ —— 175ϱࠃ~ 7,000+ ࣾһ਺ Shopifyʹ͍ͭͯ ׬શϦϞʔτԽ Digital by defaultͷ΋ͱ2020೥຤·Ͱ͸ΦϑΟεΛ׬શΫϩʔζ
6. ϚϧννϟωϧίϚʔεϓϥοτϑΥʔϜ
7. Shopify͸ൢചʹඞཁͳશͯΛαϙʔτ σβΠϯ ϗετ ܾࡁ SEO ෼ੳ σʔλ ϓϥΠόγʔ ड஫ υϝΠϯ ετΞ࡞੒ όοΫΤϯυ ϚʔέςΟϯά ҆શੑ ϒϩά
8. ൚༻ੑ͕ߴࣗ͘༝౓ͷߴ͍ΧελϚΠζ͕Մೳ ෳ਺։ൃݴޠͰࣗ༝ͳΧελϚΠζΛՄೳͱ͢Δ๛෋ͳ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. 9 ShopifyͷΞϓϦΤίγεςϜ
10. 10 ShopifyΞϓϦετΞͱύʔτφʔϓϩάϥϜ ֦େ͢Δ Τίγε ςϜ
11. 11 ೔ຊͰ΋ΞϓϦΤίγεςϜ͸ٸ֦େ ֦େ͢Δ Τίγε ςϜ ೔ຊಛԽ
12. 12 ΞϓϦ։ൃͷୈҰาɿύʔτφʔొ࿥ ֦େ͢Δ Τίγε ςϜ
13. 13 ShopifyΞϓϦͷ։ൃʹඞཁͳεΩϧ
14. 14 Ϛϧνςφϯτܕͷ΢Σϒ։ൃͷܦݧ ShopifyΞϓ Ϧ։ൃʹඞ ཁͳεΩϧ ਤͷग़యɿεϚΫϥ https://www.smclbms.com/smcl/service_edi/multiTenant ShopifyΞϓϦʹΫϥ΢υܕ OSSϓϥάΠϯʹ഑෍ܕ εέʔϧΞ΢τͷඞཁੑ
15. 15 ϑϩϯτΤϯυͱόοΫΤϯυͷόϥϯεྑ͍஌ࣝ ShopifyΞϓ Ϧ։ൃʹඞ ཁͳεΩϧ ϑϩϯτΤϯυʢετΞʣ όοΫΤϯυʢ؅ཧը໘ʣ JavaScript/HTML/CSS/Liquid GraphQL/React/REST/Database
16. 16 ShopifyΞϓϦͷΞʔΩςΫνϟ ΞϓϦͷ ߏ੒
17. 17 ShopifyΞϓϦͷΞʔΩςΫνϟ ΞϓϦͷ ߏ੒ EventBridge AWS
18. 18 Shopify App CLIͰߴ଎։ൃʂ Node+ React࢖͍ ͳΒɾɾɾ
19. 19 ShopifyΞϓϦͷ։ൃͷϚωλΠζ
20. 20 ੈքதͰ࢖ΘΕ͍ͯΔΞϓϦͷ޻৔ ΞϓϦ ύʔτφʔ ੒ޭࣄྫ
21. 21 • ࣗࣾαʔϏεΛߟ͑ͯىۀɺ·ͨ͸ͦ͏͍ͬͨձࣾͰಇ͘ • ▶︎ػೳઃܭ΍ސ٬։୓Λશ෦ࣗ෼ୡͰߦ͏ඞཁ͋Γ • ▶︎ചΕΔ·Ͱ͠ΜͲ͍ɺ֮ޛͱ͕࣌ؒඞཁ • डୗҊ݅Λड஫ͯ͠ೲ඼ɺ·ͨ͸ͦ͏͍ͬͨձࣾͰಇ͘ • ▶︎ػೳཁ݅Λސ٬͝ͱʹ٧ΊΔඞཁ͕͋Δ • ▶︎εέʔϧ͠ʹ͍͘ɺ࢓ࣄ͕ݻఆԽ͕ͪ͠ ࣗࣾαʔϏε vs डୗ։ൃ ΤϯδχΞͷ ΩϟϦΞͰΑ ͘࿩୊ʹͳΔ ͜ͱ
22. 22 • ϓϥοτϑΥʔϜͷجຊػೳ΍طଘސ٬ʹࣗࣾαʔϏεͷఏ ڙ΍डୗ։ൃΛఏڙ͢Δ • ▶︎ࣗ෼ୡͷఏڙͰ͖ΔόϦϡʔʹಛԽͰ͖Δ • ▶︎։ൃίετ͕Լ͕ΔͷͰϦεΫ΍࣌ؒΛ࡟ݮͰ͖Δ • ▶︎ػೳཁ݅͸جຊతͳ෦෼͸εΩοϓ • ▶︎෭ۀతʹ࢝Ί΍͍͢ͷͰ৽͍͠௅ઓ΋͠΍͍͢ ϓϥοτϑΥʔϜ্Ͱޮ཰Α͘Ք͙ ୈ3ͷτϨϯ υ
23. 23 ೔ຊಛԽܕͷΞϓϦͷ޻৔ ೔ຊͰͷ ࣄྫ डୗҊ݅తχʔζΛҰൠԽ
24. 24 ΫϩεϓϥοτϑΥʔϜͰαʔϏεఏڙ ೔ຊͰͷ ࣄྫ ҰൠతχʔζΛαʔϏεԽ
25. 25 ։ൃऀͱ੍࡞ձࣾͷڠۀʢΪϧυʣ ೔ຊͰͷ ࣄྫ ݸਓͱاۀͰେ͖ͳϏδωε
26. 26 ͜Μͳϒ ϩά ΋ɾɾɾ ※͋͘·Ͱύʔτφʔ͞ΜͷݸਓతͳਪଌͰ͢
27. 27 ShopifyΞϓϦͷ։ൃͷֶश
28. 28 Shopify ύʔτφʔϒϩά Shopify ΞϓϦ։ൃ ΞϓϦͷ ։ൃͱެ ։
29. 29 Shopify ΦϯϥΠϯίϛϡχςΟʢϑΥʔϥϜʣ Shopify ϑΥʔϥϜ ࣭໰ͱΞ ΠσΟΞ
30. 30 Shopify ύʔτφʔFacebookάϧʔϓ ύʔτ φʔͱͷ ڠۀ ※ࢀՃʹ͸ύʔτφʔΞΧ΢ϯτ͕ඞཁͰ͢