Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JavaScriptではじめる 音声コミュニケーション入門 / JAWS-UG Sendai 2017

JavaScriptではじめる 音声コミュニケーション入門 / JAWS-UG Sendai 2017

JAWS-UG 仙台 秋祭り - Publishing on the AWS

Hidetaka Okamoto

October 07, 2017
Tweet

More Decks by Hidetaka Okamoto

Other Decks in Technology

Transcript

  1. J a v a S c r i p t

    Ͱ ͸ ͡ Ί Δ Ի ੠ ί ϛ ϡ χέ ʔ γ ϣ ϯ ೖ ໳ J A W S - U G ઋ ୆ ळ ࡇ Γ - P u b l i s h i n g o n t h e A W S
  2. H i d e t a k a O k

    a m o t o • Digitalcube Co. Ltd. • WordCamp Kyoto 2017࣮ߦҕһ௕ • React / ASK / WordPress / CloudFormation
  3. ࠓ ೔ ͷ ࿩ • Alexa͸͍͍ͧ • ҙ֎ͱ؆୯ʹ࡞ΕΔԻ੠UI • Serverless

    FrameworkͱNode.jsͰAlexa SkillΛ࡞੒ɾӡ༻͢Δ #getshifter
  4. A l e x a S k i l l

    s • Skill = AlexaͰ࢖͑ΔΞϓϦέʔγϣϯ • amazon.comʹܝࡌՄೳ • χϡʔεϦʔμʔ΍ΫΠζetc… • ཁdeveloperΞΧ΢ϯτ 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/
  5. A u d i o C a p t u

    re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h
  6. A u d i o C a p t u

    re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h A l e x a S k i l l s K i t
  7. A u d i o C a p t u

    re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h AW S L a m b d a w e b A P I A l e x a S k i l l s K i t
  8. A u d i o C a p t u

    re A u d i o P l a y b a c k C a l l w e b A P I Ta l k s o m t h i n g R e s p o n c e S p e e c h t o Te x t Te x t t o S p e e c h w e b A P I ͩ ͚ ࡞ Ε ͹ ͍ ͍ A l e x a S k i l l s K i t
  9. [ ج ຊ ] A l e x a S

    k i l l ͸ J S O N Λ ड ͚ औ ͬͯ J S O N Λ ฦ ͢ { " v e r s i o n " : " s t r i n g " , " re s p o n s e " : { " o u t p u t S p e e c h " : { " t y p e " : " s t r i n g " , " t e x t " : " s t r i n g " , " s s m l " : " s t r i n g " } , " c a rd " : { " t y p e " : " s t r i n g " , " i m a g e " : { " s m a l l I m a g e U r l " : " s t r i n g " , " l a rg e I m a g e U r l " : " s t r i n g " } … #getshifter
  10. A l e x a S k i l l

    s K i t S D K f o r N o d e . j s E x a m p l e s • Hello World • RSS / ATOM Feed ͷಡΈ্͛ • ΫΠζήʔϜ • γςΟΨΠυ • etc… https://github.com/alexa/
  11. A l e x a S D K Λ ࢖

    ͏ ( 1 ) - Π ϯε τ ʔ ϧ $ n p m i n i t - y $ n p m i n s t a l l — s a v e a l e x a - s d k #getshifter
  12. A l e x a S D K Λ ࢖

    ͏ ' u s e s t r i c t ' ; c o n s t A l e x a = re q u i re ( ' a l e x a - s d k ' ) ; m o d u l e . e x p o r t s . h e l l o = ( e v e n t , c o n t e x t , c a l l b a c k ) = > { c o n s t a l e x a = A l e x a . h a n d l e r ( e v e n t , c o n t e x t , c a l l b a c k ) ; a l e x a . re g i s t e r H a n d l e r s ( h a n d l e r s ) ; a l e x a . e x e c u t e ( ) ; } ; #getshifter
  13. A l e x a S D K Λ ࢖

    ͏ ' u s e s t r i c t ' ; c o n s t A l e x a = re q u i re ( ' a l e x a - s d k ' ) ; m o d u l e . e x p o r t s . h e l l o = ( e v e n t , c o n t e x t , c a l l b a c k ) = > { c o n s t a l e x a = A l e x a . h a n d l e r ( e v e n t , c o n t e x t , c a l l b a c k ) ; a l e x a . re g i s t e r H a n d l e r s ( h a n d l e r s ) ; a l e x a . e x e c u t e ( ) ; } ; S D K ͷ ಡ Έ ࠐ Έ ϋ ϯ υ ϥ ͷ η ο τΞ οϓ ϋ ϯ υ ϥ ͷ ઃ ఆ ࣮ ߦ #getshifter
  14. Πϕ ϯ τϋ ϯ υ ϥ ͸ O b j

    e c t ܗ ࣜ Ͱ v a r h a n d l e r s = { ' L a u n c h R e q u e s t ' : f u n c t i o n ( ) { t h i s . e m i t ( ' : t e l l ' , ' H e l l o ' ) ; } , } , ' N a m e I n t e n t ' : f u n c t i o n ( ) { c o n s t s l o t s = t h i s . e v e n t . re q u e s t . i n t e n t . s l o t s ; c o n s t n a m e Va l u e = s l o t s . N a m e S l o t . v a l u e ; t h i s . e m i t ( ' : t e l l ' , ` N i c e t o m e e t y o u , $ { n a m e Va l u e } . E n j o y A l e x a w o r l d ! ` ) ; } , } ; I N T E N T ໊ Λ Ω ʔ ʹ ͢ Δ S L O T ͷ ৘ ใ Λ औ ಘ ͢ Δ t h i s . e m i t ʹ Ϩε ϙ ϯε ͳ Ͳ Λ ॻ ͘ #getshifter
  15. ஌ ͬͯ ͓ ͖ ͨ ͍ A l e x

    a S k i l l ༻ ޠ • Intent: Alexaʹ࿩͔͚ͨ͠಺༰ͷ෼ྨ݁Ռ • Slot:ɹAlexaʹ࿩͔͚ͨ͠಺༰ͷม਺෦෼
  16. A l e x a , ࡢ ೔ ͷ ࡕ

    ਆ ઓ ͷ ݁ Ռ Λ ڭ ͑ͯ • <໺ٿͷ݁Ռݕࡧ> {೔෇}ͷ{ର৅ήʔϜ}ͷ݁ՌΛڭ͑ͯ • Intentɹɹɹɹɹˠɹ<໺ٿͷ݁Ռݕࡧ> • ೔෇Slotɹɹɹɹˠɹࡢ೔ • ର৅ήʔϜSlotɹˠɹࡕਆઓ http://dev.classmethod.jp/cloud/summary-about-built-in-intent-and-built-in-slot-type/
  17. I n t e n t ຖ ʹ h a

    n d l e r s ͱ ͯ͠ ొ ࿥ ͢ Δ v a r h a n d l e r s = { ' L a u n c h R e q u e s t ' : f u n c t i o n ( ) { t h i s . e m i t ( ' : t e l l ' , ' H e l l o ' ) ; } , } , ' N a m e I n t e n t ' : f u n c t i o n ( ) { c o n s t s l o t s = t h i s . e v e n t . re q u e s t . i n t e n t . s l o t s ; c o n s t n a m e Va l u e = s l o t s . N a m e S l o t . v a l u e ; t h i s . e m i t ( ' : t e l l ' , ` N i c e t o m e e t y o u , $ { n a m e Va l u e } . E n j o y A l e x a w o r l d ! ` ) ; } , } ; I N T E N T ໊ Λ Ω ʔ ʹ ͢ Δ S L O T ͷ ৘ ใ Λ औ ಘ ͢ Δ t h i s . e m i t ʹ Ϩε ϙ ϯε ͳ Ͳ Λ ॻ ͘ #getshifter
  18. Tr y E x a m p l e s

    ! • αϯϓϧεΩϧ͸શͯηοτΞοϓΨΠυ෇͖ • εΫγϣ΋͋ΔͷͰӳޠۤखͰ΋҆৺ • ࡞Γ͍ͨεΩϧͷαϯϓϧΛϕʔεʹ ɹσʔλΛॻ͖׵͑ͯ ɹࣗ෼ͷεΩϧʹ͠Α͏ʂ http://bit.ly/2vSAZhB
  19. S e r v e r l e s s

    F r a m e w o r k ͱ N o d e . j s Ͱ A l e x a S k i l l Λ ࡞ ੒ ɾ ӡ ༻ ͢ Δ
  20. S e r v e r l e s s

    F r a m e w o r k h t t p s : / / s e r v e r l e s s . c o m #getshifter
  21. S e r v e r l e s s

    F r a m e w o r k • Node.js੡ͷServerlessΞϓϦέʔγϣϯͷσϓϩΠɾ؅ཧπʔϧ • AWSɾGCPɾAzureɾIBMͷෳ਺ϓϥοτϑΥʔϜରԠ • YAMLܗࣜͰϦιʔεΛఆٛ͢ΔͷͰɺߏ੒؅ཧ͕؆୯ #getshifter
  22. S e r v e r l e s s

    F r a m e w o r k Λ ಋ ೖ ͢ Δ $ n p m i n s t a l l - g s e r v e r l e s s $ c d / PAT H / T O / Y O U R / A P P $ s l s c re a t e - t a w s - n o d e j s $ s l s d e p l o y #getshifter
  23. σΟ Ϩ Ϋ τ Ϧ ߏ ଄ $ t re

    e - L 1 . ᵓ ᴷ ᴷ h a n d l e r. j s ᵓ ᴷ ᴷ n o d e _ m o d u l e s ᵓ ᴷ ᴷ p a c k a g e . j s o n ᵋ ᴷ ᴷ s e r v e r l e s s . y m l #getshifter
  24. s e r v e r l e s s

    . y m l s e r v i c e : n o d e - a l e x a - t d d - e x a m p l e f r a m e w o r k Ve r s i o n : " > = 1 . 1 0 . 1 " p ro v i d e r : n a m e : a w s r u n t i m e : n o d e j s 6 . 1 0 re g i o n : u s - e a s t - 1 p a c k a g e : i n c l u d e : - n o d e _ m o d u l e s / f u n c t i o n s : h e l l o : h a n d l e r : h a n d l e r. h e l l o e v e n t s : - a l e x a S k i l l #getshifter
  25. s e r v e r l e s s

    . y m l - 1 s e r v i c e : n o d e - a l e x a - t d d - e x a m p l e f r a m e w o r k Ve r s i o n : " > = 1 . 1 0 . 1 " ϓ ϩ δΣ Ϋ τ ໊ S E R V E R L E S S ͷ όʔ δ ϣ ϯ #getshifter
  26. s e r v e r l e s s

    . y m l - 2 p ro v i d e r : n a m e : a w s r u n t i m e : n o d e j s 6 . 1 0 re g i o n : u s - e a s t - 1 ར ༻ ͢ Δ Ϋ ϥ ΢ υ ϥϯ λ ΠϜ σ ϓ ϩ Π ઌ #getshifter
  27. s e r v e r l e s s

    . y m l - 3 p a c k a g e : i n c l u d e : - n o d e _ m o d u l e s / ಉ ࠝ ͢ Δ σΟ Ϩ Ϋ τ Ϧ #getshifter
  28. s e r v e r l e s s

    . y m l - 4 f u n c t i o n s : h e l l o : h a n d l e r : h a n d l e r. h e l l o e v e n t s : - a l e x a S k i l l L A M B D A ͷ Πϕ ϯ τ Λ A S K ʹ ࣮ ߦ ͢ Δ ؔ ਺ ໊ ϑ Ν ϯ Ϋ γ ϣ ϯ ໊ #getshifter
  29. S e r v e r l e s s

    F r a m e w o r k Ͱ σ ϓ ϩ Π ΍ ಈ ࡞ ֬ ೝ ͢ Δ # ຊ ൪ ༻ ͷ σ ϓ ϩ Π $ s l s d e p l o y — s t a g e p ro d u c t i o n # ݸ ਓ Ξ Χ ΢ ϯ τ ʹ σ ϓ ϩ Π $ s l s d e p l o y — s t a g e d e v e l o p m e n t — p ro f i l e m y l o c a l # ϩ ʔΧ ϧ Ͱ ͷ ಈ ࡞ ֬ ೝ $ s l s i n v o k e l o c a l - f h e l l o #getshifter
  30. ࣮ ࡍ ʹ S k i l l Λ ެ

    ։ ͠ ͨ ྫ h t t p s : / / w w w. a m a z o n . c o m / D i g i t a l c u b e - I n c - S h i f t e r- m a n / #getshifter
  31. A l e x a S k i l l

    ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • Update͸গͳ͘ͱ΋̎ύλʔϯ • Serverless FWͷstage͕ศར • ೔ຊޠ͸΋͏ͪΐ͍զຫ
  32. A l e x a S k i l l

    ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • Update͸গͳ͘ͱ΋̎ύλʔϯ • Serverless FWͷstage͕ศར • ೔ຊޠ͸΋͏ͪΐ͍զຫ
  33. g i t h u b . c o m

    / a l e x a ͸ ΋ ͬ ͱ ஌ Β Ε Δ ΂ ͖ • ̍̌छྨۙ͘ͷαϯϓϧεΩϧ͕ެ։ࡁΈ • ίʔυʹ͸ίϝϯτͰώϯτ͕͋Δ • ηοτΞοϓΨΠυ෇͖ • ϢχοτςετͳͲ΋ • ΈΜͳελʔ෇͚Α͏ http://bit.ly/2vSAZhB
  34. h t t p s : / / g i

    t h u b . c o m / a l e x a / s k i l l - s a m p l e - n o d e j s - q u i z - g a m e / b l o b / m a s t e r / s rc / i n d e x . j s ʮ͜͜Λॻ͖׵͑Ζʯͱ͍͏ίϝϯτ͕͍͍ͭͯΔ
  35. A l e x a S k i l l

    ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • Update͸গͳ͘ͱ΋̎ύλʔϯ • Serverless FWͷstage͕ศར • ೔ຊޠ͸΋͏ͪΐ͍զຫ
  36. AW S L a m b d a ͷ A

    R N ͔ A P I U R L Λ ࢦ ఆ ͢ Δ
  37. L i v e ͷ S k i l l

    ͸ ” d e v e l o p m e n t ” Ϟ ʔ υ Ͱ ࡞ ۀ
  38. A R N ΍ U R L ɾ I n

    t e n t ͳ Ͳ Λ ߋ ৽ “ S u b m i t f o r C e r t i f i c a t i o n ” Ͱ Ϩ Ϗϡ ʔ ґ པ
  39. ࢦ ఆ ͠ ͨ L a m b d a

    ͷ Ξ οϓ σ ʔ τ ͸ ʢ ࠓ ͷ ॴ ʣ ਃ ੥ ෆ ཁ
  40. S k i l l ͷ U p d a

    t e ʹ ͭ ͍ͯ ʢ ࢲ ݟ ʣ • Intent΍SlotͳͲͷΠϯλϥΫγϣϯͷมߋͷ༗ແͰ൑அ • ιʔεͷߋ৽͚ͩͳΒLambda΍APIόοΫΤϯυΛߋ৽͢Δ͚ͩ • ΠϯλϥΫγϣϯͷมߋ࣌͸Amazonʹਃ੥͕ඞཁ • Echo ShowରԠ΍ݴޠ௥ՃͳͲ΋ཁਃ੥
  41. A l e x a S k i l l

    ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • Update͸গͳ͘ͱ΋̎ύλʔϯ • Serverless FWͷstage͕ศར • ೔ຊޠ͸΋͏ͪΐ͍զຫ
  42. AW S L a m b d a ͷ A

    R N ͔ A P I U R L Λ ࢦ ఆ ͢ Δ
  43. ߋ ৽ ຖ ʹ ৽ ͠ ͍ L a m

    b d a Λ σ ϓ ϩ Π ͢ Δ ඞ ཁ ͕ ͋ Δ
  44. s t a g e = v e r s

    i o n ʹ ͢ Δ ͱ Θ ͔ Γ ΍ ͢ ͍ # s t a g e ʹ όʔ δ ϣ ϯ ໊ Λ ࢦ ఆ $ s l s d e p l o y — s t a g e v 1 - 1 - 0 # ߋ ৽ ͕ ऴ Θ Ε ͹ ݹ ͍ όʔ δ ϣ ϯ Λ ࡟ আ $ s l s re m o v e — s t a g e v 1 - 0 - 0 #getshifter
  45. A l e x a S k i l l

    ެ ։ ɾ ӡ ༻ Ͱ ײ ͡ ͨ ͜ ͱ • Example͕༏ल • Update͸গͳ͘ͱ΋̎ύλʔϯ • Serverless FWͷstage͕ศར • ೔ຊޠ͸΋͏ͪΐ͍զຫ
  46. ӳ ޠ ɾ υ Π π ޠ Ҏ ֎ ͸

    Ϩ Ϗϡ ʔ Ͱ ஄ ͔ Ε Δ ( 2 0 1 7 / 1 0 ࣌ ఺ ) Issue with the feed “AMIMOTO News”: What went wrong? All feed content must be presented in a language currently supported by Alexa. The current supported languages are English and German. Note: Please note that the home card and the URL is displaying in Japanese language. What to do next. Please refer to our documentation for more information.
  47. ४ උ ͩ ͚ ͯ͠ ਃ ੥ ͸ ͪ ΐ

    ͬ ͱ զ ຫ https://amazon-press.jp/Top-Navi/Press-releases/Presselist/Press-release/amazon/jp/Devices/2017/Amazon-Alexa-1002/
  48. S h i f t e r m a n

    S k i l l ͸ O S S h t t p s : / / g i t h u b . c o m / g e t s h i f t e r / a l e x a - s h i f t e r m a n #getshifter
  49. ա ڈ ͷ εϥ Π υ ΋ ͍ Ζ ͍

    Ζ ͋ Γ · ͢ • Serverless FW·ΘΓ: http://bit.ly/2yNmrOF • WordPressͰAlexa: http://bit.ly/2qvOtvg • Testͷ͜ͱͳͲ: http://bit.ly/2xYb8GN
  50. ࠓ ೔ ͷ ࿩ • Alexa͸͍͍ͧ • ҙ֎ͱ؆୯ʹ࡞ΕΔԻ੠UI • Serverless

    FrameworkͱNode.jsͰAlexa SkillΛ࡞੒ɾӡ༻͢Δ • Alexa͸͍͍ͧ #getshifter