WordCamp Tokyo 2017 / HUB / プラットフォームとしての WordPress

WordCamp Tokyo 2017 Session day

Transcript

1. H U B / ϓ ϥ ο τϑ Υ ʔϜ ͱ ͯ͠ͷ
   Wo rd P re s s
   Wo rd C a m p To k y o 2 0 1 7 S e s s i o n d a y
   

   View Slide

2. ࠓ ೔ ͷ ࿩
   • WordPressͰʮ΍ΕΔ͜ͱʯͱʮ΍Δ΂͖͜ͱʯ͸ҧ͏
   • ಘҙͳ͜ͱ͸ɺಘҙͳͱ͜Ζʹ೚ͤΑ͏
   • దࡐదॴͰૉૣ͘ߦಈɾ൑அ͢Δ͜ͱ͕ඞཁ
   • ίϛϡχςΟʹࢀՃͯ͠ɺʮࣗ෼ͷϞϊαγʯΛݟ͚ͭΑ͏
   

   View Slide

3. H i d e t a k a
   O k a m o t o
   • Digitalcube Co. Ltd.
   • ೔ຊޠϑΥʔϥϜੈ࿩໾
   • WordCamp Kyoto 2017࣮ߦҕһ௕
   

   View Slide

4. Wo rd P re s s ͷ ڧ Έ ͷ ̍ ͭ
   • ςʔϚͰͷ؆୯ͳσβΠϯมߋ
   • ϓϥάΠϯͰͷػೳ௥Ճ
   • ϑοΫͰΧελϚΠζ΋ࣗ༝
   • ϊ΢ϋ΢΋ଟ͍
   

   View Slide

5. ڊ େ ͳ Ϟ ϊ Ϧε Խ ͢ Δ Wo rd P re s s α Π τ
   • ΧελϜϑΟʔϧυ΁ͷෳࡶͳݕࡧΫΤϦ
   • ΞοϓσʔτͰམͪΔϑϩϯτΤϯυ
   • σʔλ૿ՃͰύϑΥʔϚϯε௿Լ
   • ΞϓϦԽ͢ΔwebͷྲྀΕ
   

   View Slide

6. ʮ Wo rd P re s s Ͱ ͳ ʹ ΋ ͔ ΋ ΍ Β ͳ ͍ ʯ
   ͱ ͍ ͏ બ ୒ ࢶ
   

   View Slide

7. H U B / ϓ ϥ ο τϑ Υ ʔϜ ͱ ͯ͠
   Wo rd P re s s Λ ར ༻ ͢ Δ
   

   View Slide

8. Wo rd P re s s ͷ ศ ར ͳ ͱ ͜ Ζ
   • ચ࿅͞Εͨ؅ཧը໘ɾΤσΟλ
   • ϒϩά΍ϝσΟΞ޲͚ͷߏ଄
   • ϑοΫ΍APIͰ࿈ܞ͕༰қ
   

   View Slide

9. H U B ΍ ϓ ϥ ο τϑ Υ ʔϜ ͱ ͯ͠ ͷ Wo rd P re s s
   • HUBɿWordPress͔Β֎෦αʔϏεΛར༻͢Δ
   • ϓϥοτϑΥʔϜɿ֎෦ͷαʔϏε͕WordPressΛར༻͢Δ
   

   View Slide

10. H U B ΍ ϓ ϥ ο τϑ Υ ʔϜ ͱ ͯ͠ ͷ Wo rd P re s s
    • HUBɿWordPress͔Β֎෦αʔϏεΛར༻͢Δ
    • ϓϥοτϑΥʔϜɿ֎෦ͷαʔϏε͕WordPressΛར༻͢Δ
    

    View Slide

11. H U B : ֎ ෦ α ʔ Ϗ ε Λ Wo rd P re s s ͕ ར ༻ ͢ Δ
    • ݕࡧͷ֎෦Խ - Algolia / Elasticsearch
    • ໰͍߹Θͤͷ֎෦࿈ܞ - Mautic / kintone
    • ը૾ͷλά෇͚ࣗಈԽ - AWS
    • more…
    

    View Slide

12. ݕ ࡧ ͷ ֎ ෦ Խ - A l o g o l i a / E l a s t i c s e a rc h
    • શจݕࡧΤϯδϯͷFaaS ͱ OSS
    • transition_post_statusͳͲͰߋ৽ΛϑοΫ
    • هࣄσʔλΛAPIܦ༝Ͱૹ৴
    • ݕࡧॲཧΛஔ׵ͯ͠ར༻
    https://www.algolia.com/
    https://www.elastic.co/jp/
    products/elasticsearch
    

    View Slide

13. ࿈ ܞ ϓ ϥ άΠ ϯ ΋ ֤ छ Ϧ Ϧ ʔε ࡁ Έ
    • Search by Algolia(ݕࡧϑΥʔϜͷஔ׵ͳͲ)
    • WP Simple ElasticsearchʢݕࡧΫΤϦͷॻ͖׵͑ʣ
    • ElasticPressʢؔ࿈هࣄදࣔͳͲʹ΋ରԠʣ
    • etc…
    

    View Slide

14. ໰ ͍ ߹ Θ ͤ ͷ ֎ ෦ ࿈ ܞ - M a u t i c / k i n t o n e
    • ໰͍߹ΘͤϑΥʔϜͷσʔλΛ֎෦αʔϏε΁
    • Mautic(OSS)΍kintone(SaaS)ʹҠৡ
    • WordPress͸Viewʹઐ೦͢Δ
    https://jp.mautic.org/
    https://kintone.cybozu.com/jp/
    

    View Slide

15. ֤ छ ࿈ ܞ ϓ ϥ άΠ ϯ
    • Publish kintone data(kintoneσʔλͷΠϯϙʔτ)
    • WP to kintone (kintoneϑΥʔϜͷૠೖ)
    • WP Mautic(τϥοΩϯάɾϑΥʔϜૠೖ)
    • Mauticommerce(WooϑΥʔϜ࿈ܞ)
    • and more
    

    View Slide

16. ը ૾ ͷ λ ά ෇ ͚ Λ ࣗ ಈ Խ
    • Ξοϓϩʔυը૾ͷλά෇͚Λ֎෦Խ
    • ը૾ೝࣝαʔϏεΛར༻ͯ͠ղੳ
    • ղੳ݁ՌΛλάͱͯ͠ར༻͢Δ
    

    View Slide

17. 3 6 0 i m a g e s . i o
    • 360°ը૾ൢചαΠτɿhttp://www.360images.io/
    • λά෇͚ͷࣗಈԽ
    • ࿈ܞϓϥάΠϯΛOSSʹ
    https://wordpress.org/plugins/wp-rekogni/
    

    View Slide

18. ͦ ͷ ΄ ͔ ʹ ΋ ࣄ ྫ ɾ Ϣ ʔεέ ʔε ͸ ͨ ͘ ͞ Μ
    • StripeΛ༻͍ܾͨࡁॲཧͷ֎෦Խ
    • kintoneͷσʔλΠϯϙʔτ
    • Woo + MauticͰCVRվળ
    • Backlog࿈ܞ
    https://tech.linkbal.co.jp/2932/
    

    View Slide

19. ཉ ͠ ͍ ػ ೳ ͷ A P I Λ ୳ ͢ͱ ͍ ͏ ։ ൃ ํ ๏
    • WordPress͸APIίʔϧʹศརͳಠࣗؔ਺͕͋Δ
    • APIΛ࣋ͭ֎෦αʔϏεͱ࿈ܞͯ͠ޮ཰Խ
    • WordPress͸ίϯςϯπ؅ཧʹಛԽ
    • ಘҙ෼໺ʹϑΥʔΧεͨ͠։ൃ
    

    View Slide

20. H U B ΍ ϓ ϥ ο τϑ Υ ʔϜ ͱ ͯ͠ ͷ Wo rd P re s s
    • HUBɿWordPress͔Β֎෦αʔϏεΛར༻͢Δ
    • ϓϥοτϑΥʔϜɿ֎෦ͷαʔϏε͕WordPressΛར༻͢Δ
    

    View Slide

21. ϓ ϥ ο τϑ Υ ʔϜ : ֎ ෦ α ʔ Ϗ ε ͕ Wo rd P re s s Λ ར ༻ ͢ Δ
    • ϑϩϯτΤϯυͱΞϓϦͷ෼཭
    • SaaS΁ͷ૊ΈࠐΈ
    • Ի੠σόΠε
    http://air.areaia.jp/
    http://ustwo.com/
    

    View Slide

22. ϑ ϩ ϯ τ Τ ϯ υ ͱ Ξ ϓ Ϧ ͷ ෼ ཭ - P ro g re s s i v e We b A p p s
    • ϑϩϯτΤϯυͱΞϓϦͷαʔόʔΛ෼཭
    • εέʔϥϏϦςΟ΍଱ো֐ੑͷ޲্
    • SPAԽͰϞόΠϧΞϓϦʹ΋
    • ΦϑϥΠϯରԠͳͲ
    http://bit.ly/2vNZtWt
    https://github.com/ustwo/
    ustwo.com-frontend
    

    View Slide

23. ཉ ͠ ͍ ػ ೳ ͷ A P I Λ ୳ ͢ͱ ͍ ͏ ։ ൃ ํ ๏
    • WP API΍WordPress.com API͔ΒهࣄσʔλΛऔಘ
    • ϑϩϯτΤϯυ͸React ΍ Angular
    • Ionic / React NativeͰͷϞόΠϧΞϓϦԽ
    • OSSͰެ։͍ͯ͠ΔαΠτ΋
    http://air.areaia.jp/
    http://ustwo.com/
    https://ionic-wp.com/
    

    View Slide

24. S a a S ΁ ͷ ૊ Έ ࠐ Έ - N o m a d b a s e / H a p p y Ta b l e s
    • αʔϏεͷόοΫΤϯυʹWordPressΛར༻
    • Ϣʔβʔ΍ళฮ৘ใΛWordPressʹอଘ
    • ϑϩϯτΤϯυ͔Β͸APIܦ༝Ͱऔಘ͢Δ
    https://nomadbase.io/
    https://www.npmjs.com
    http://www.happytables.com/
    

    View Slide

25. – n p m
    “npm͸ɺυΩϡϝϯςʔγϣϯ΍ϓϩμΫτͷϖʔδͷͨΊʹ
    WordPressΛηϯτϥϧϋϒͷΑ͏ʹ࢖͍͍ͨͱߟ͑·ͨ͠ɻ
    ͦΕʹΑͬͯίϯςϯπͷஶऀ͕؆୯ʹσʔλΛ௥ՃͰ͖ΔΑ͏ʹ
    ͳΓɺΫϥΠΞϯτʹJSONͰ഑৴͞Ε·͢ɻ”
    https://github.com/miya0001/rest-api-white-paper/blob/japanese-translation/ja/05a-case-study-ustwo.md
    

    View Slide

26. Ի ੠ σόΠ ε - A m a z o n A l e x a
    • AmazonͷԻ੠ೝࣝαʔϏεˍσόΠε
    • όοΫΤϯυʹWeb API͕ར༻Մೳ
    • Ұ෦RSS FeedରԠ
    https://www.amazon.com/dp/B01E6AO69U
    h t t p s : / / d e v e l o p e r. a m a z o n . c o m / a l e x a -
    s k i l l s - k i t
    

    View Slide

27. χ ϡ ʔε ΍ ϓ ϩ μΫ τ ঺ հ ͷ σ ʔ λ ι ʔε ʹ Wo rd P re s s
    • WordPressͷFeedΛAlexa͸ೝࣝ͢Δ
    • New York TimesͳͲ͕SkillϦϦʔεࡁ
    • AWS Lambda + WP APIͰΧελϜSkill
    • طଘίϯςϯπΛԻ੠σόΠε΁
    https://amimoto-ami.com/amimoto-ninja/
    https://www.amazon.com/Daily-New-York-Times/dp/B01MY9B5BB/
    https://www.amazon.com/Digitalcube-Inc-Shifter-man/dp/B07572D7N8/
    

    View Slide

28. Wo rd P re s s ͷ ί ϯ ςϯ π Λ ༗ ޮ ར ༻ ͢ Δ
    • WordPressʹ஝͑ΒΕͨίϯςϯπΛ༗ޮར༻͢Δ
    • WP APIΛ࢖͏͜ͱͰ࿈ܞ͕ΑΓ؆୯ʹ
    • ίϯςϯπͷू໿Ͱ؅ཧΛޮ཰Խ
    • ࠓ͋Δ΋ͷͰͰ͖Δ
    

    View Slide

29. ʮ Wo rd P re s s ͩ ͚ Ͱ શ ෦ ΍ Β ͳ ͍ ʯ
    ͱ ͍ ͏ બ ୒ ࢶ
    

    View Slide

30. H U B Խ ɾ ϓ ϥ ο τϑ Υ ʔϜ Խ Ͱ
    Wo rd P re s s Λ ਎ ܰ ʹ ͢ Δ
    

    View Slide

31. ެ ։ 6 ೔ Ͱ 1 0 0 ສ P V ౸ ୡ ͠ ͨ αΠ τ
    h t t p s : / / o re n o - y o m e . c o m /
    

    View Slide

32. ੍ ࡞ ظ ؒ ɿ ̏ ࣌ ؒ
    h t t p s : / / z e n l o g i c . j p / c a s e / i n t ro d u c t i o n 1 5 . h t m l
    

    View Slide

33. Ϟ όΠϧΞ ϓ Ϧ ( i O S / A n d ro i d ) ʹ ΋ ల ։
    h t t p s : / / i t u n e s . a p p l e . c o m / u s / a p p / Զ ͷ Շ ͕ Մ Ѫ ͍ / i d 1 2 6 1 0 3 6 5 5 0
    

    View Slide

34. ૉ ૣ ͘ ͸ ͡ Ίͯ
    ૉ ૣ ͘ վ ળ ͢ Δ
    

    View Slide

35. “ ֎ ͷ Ϟ ϊ α γ ” Λ ஌ Ε ͹ ɺ Wo rd P re s s ͸ ΋ ͬ ͱ ָ ͠ ͘ ͳΔ ʂ
    h t t p s : / / w w w. d i g i t a l c u b e . j p / i n f o r m a t i o n / 3 6 1 7 /
    Wo rd C a m p K y o t o 2 0 1 7
    

    View Slide

36. T h i n k B i g , S t a r t S m a l l ,
    a n d S c a l e F a s t
    

    View Slide

37. T h i n k B i g , S t a r t S m a l l ,
    a n d S c a l e F a s t
    Thanks!
    

    View Slide