Riot.jsでSSRを利用してサイトが生成したかった話 Grand Frontend Osaka 2016 Lightning Talk

https://kfug.jp/gfo2016 #frontkansai

Transcript

1. 3JPUKTͰ443Λར༻ͯ͠αΠτ͕ੜ੒ͨ͠ ͔ͬͨ࿩ (SBOE
   'SPOUFOE
   0TBLB
   
   5",6."
   )BOBUBOJ!QPUBUPE
2. ࣗݾ঺հ w Ֆ୩୓ຏ 1PUBUPE
   w ϓϩάϥϜॻ͍ͨΓσβΠϯͨ͠Γ
   w GSPOULBOTBJ
   4UB⒎
   w ͳΜ͔ॳΊʹ࿩ͯͨ͠ਓ
   w Ұ࣌ظK2VFSZ͓͡͞Μͱݺ͹Ε͍ͯͨ
   w ࠓ೔͸3JPU͓͡͞Μ΍Γ·͢
3. 3JPU࢖ͬͯ·͔͢ʁ
4. ࢖ͬͯ·͢Ͷʁ
5. ࢖ͬͯ·͢ΑͶʁ
6. ࢖ͬͯΔલఏͰ͍͖·͢
7. 3JPUͷ͖͢ͳͱ͜Ζ
8. 3JPUͷ͖͢ͳͱ͜Ζ w खܰʹѻ͑ͯίϯϙʔωϯτ͕ग़དྷΔͷ͕ศར
   
9. 3JPUͷ͖͢ͳͱ͜Ζ w खܰʹѻ͑ͯίϯϙʔωϯτ͕ग़དྷΔͷ͕ศར
   w 4DPQFE
   $44ʹରԠʢͭΑ͍ʣ
   
10. 3JPUͷ͖͢ͳͱ͜Ζ w खܰʹѻ͑ͯίϯϙʔωϯτ͕ग़དྷΔͷ͕ศར
    w 4DPQFE
    $44ʹରԠʢͭΑ͍ʣ
    w ඪ४Ͱ443͕͍͍ͭͯΔΒ͍͠
    
11. 3JPUͷ͖͢ͳͱ͜Ζ w खܰʹѻ͑ͯίϯϙʔωϯτ͕ग़དྷΔͷ͕ศར
    w 4DPQFE
    $44ʹରԠʢͭΑ͍ʣ
    w ඪ४Ͱ443͕͍͍ͭͯΔΒ͍͠
    w ࢿྉ͕ඇৗʹগͳ͍ͷͰ։୓ͷ͕͍͕͋͠Δ
    
12. Μʁ
13. खܰͳίϯϙʔωϯτ
14. खܰͳίϯϙʔωϯτ 4DPQFE
    $44
15. 443͕Մೳ खܰͳίϯϙʔωϯτ 4DPQFE
    $44
16. ͜ΕςϯϓϨʔτΤϯδϯ
    ͱͯ͠΋ڧ͍ͷͰ͸ʁ
17. ΍Γ͍ͨ͜ͱ w ୯७ͳ443ͷ৔߹ɺ/PEF͕ಈ͘αʔόʔ͕ඞཁʹͳΔ͕ɺΫϥ ΠΞϯταΠυͰ͸4&00(1ͱ͔͕ͭΒ͍ͷͰ)5.-Λు͖ग़ ͯ͠ཉ͍͠
    w ͦͷςϯϓϨʔτΤϯδϯʹɺ4DPQFE
    $44͕ѻ͑ͯɺಈతͳύ ϥϝʔλΛجʹ)5.-Λੜ੒ग़དྷΔ3JPUΛ࢖͍͍ͨ
    w )5.- $44 K2VFSZ͔͠࢖Θͳ͍ਓͰ΋ίϯϙʔωϯτԽͱ 4DPQFE
    $44ͷϝϦοτΛڗडͰ͖Δ࢓૊ΈΛͭ͘Γ͍ͨ
    w AOQN
    SVO
    HFOFSBUFAͰ443Λ$-*Ͱ૸Βͤͯ)5.-Λࣗಈੜ੒ ͢Δ
18. ΍ͬͯΈͨ
19. ΍ͬͯΈͨ %FNP
20. ΍ͬͯΈͨ
21. 4DPQFE
    $44
    ରԠͯ͠ͳ͍໰୊
22. ͭΒ͍
23. Ҿ͖Լ͕Εͳ͘ͳͬͨਓ
24. Ҿ͖Լ͕Εͳ͘ͳͬͨਓ w ࠓճ͸αʔόʔαΠυϨϯμϦϯάͷػೳΛ༻͍ͯͲ͏ʹ͔ ͯ͠)5.-Λग़ྗ͢Δ͜ͱ͕໨తͰ͋ͬͯɺखஈ͸໰Θͳ͍
    
25. Ҿ͖Լ͕Εͳ͘ͳͬͨਓ w ࠓճ͸αʔόʔαΠυϨϯμϦϯάͷػೳΛ༻͍ͯͲ͏ʹ͔ ͯ͠)5.-Λग़ྗ͢Δ͜ͱ͕໨తͰ͋ͬͯɺखஈ͸໰Θͳ͍
    w XFCQBDLͰݻΊͨCVOEMFKTΛΫϥΠΞϯταΠυͰ࣮ߦ͠ ͯɺͦͷ݁ՌΛड͚औΔͱྑ͍ͷͰ͸ʁ
    
26. Ҿ͖Լ͕Εͳ͘ͳͬͨਓ w ࠓճ͸αʔόʔαΠυϨϯμϦϯάͷػೳΛ༻͍ͯͲ͏ʹ͔ ͯ͠)5.-Λग़ྗ͢Δ͜ͱ͕໨తͰ͋ͬͯɺखஈ͸໰Θͳ͍
    w XFCQBDLͰݻΊͨCVOEMFKTΛΫϥΠΞϯταΠυͰ࣮ߦ͠ ͯɺͦͷ݁ՌΛड͚औΔͱྑ͍ͷͰ͸ʁ
    w ηϧϑεΫϨΠϐϯάͰୡ੒͢Δ͜ͱʹ
    
27. Ҿ͖Լ͕Εͳ͘ͳͬͨਓ w ࠓճ͸αʔόʔαΠυϨϯμϦϯάͷػೳΛ༻͍ͯͲ͏ʹ͔ ͯ͠)5.-Λग़ྗ͢Δ͜ͱ͕໨తͰ͋ͬͯɺखஈ͸໰Θͳ͍
    w XFCQBDLͰݻΊͨCVOEMFKTΛΫϥΠΞϯταΠυͰ࣮ߦ͠ ͯɺͦͷ݁ՌΛड͚औΔͱྑ͍ͷͰ͸ʁ
    w ηϧϑεΫϨΠϐϯάͰୡ੒͢Δ͜ͱʹ
    w SJPUMPBEFSͱ͔ͰΨοπϦ/PEF؀ڥ࢖͍ͬͯΔͷͰɺ·ͱ Ίͯ؅ཧ͢ΔҙຯͰ΋/PEFͰಈ͔͢
28. /JHIUNBSF࢖ͬͨ &MFDUSPO͕ೖͬͯͯͳΜ͔ΊͬͪΌ$ISPNFࣗಈԽͰ͖Δ΍ͭʢҙ༁ʣ
29. σϞ
30. ͪΐͬͱͭΒ͍
31. ΍ͬͯΈͨ݁Ռ w औΓ׶͑ͣ3JPUͰ׬੒ࡁΈͷ)5.-Λు͘ͱ͍͏໨త͸ୡ ੒ͨ͠
    w ΠΠΧϯδʹ443ग़དྷΔͳΒͦ΋ͦ΋ؤுΔඞཁ͕ͳ͍͏ ͑ɺ͜ͷ··ͩͱςϯϓϨʔτΤϯδϯͱ͔ͯ͠͠ར༻͕ Ͱ͖ͳ͍ͷͰधཁ͕ߦํෆ໌
    w ݸਓతʹ͸ָ͚ͩͲɺअಓײ͕͋ͬͯקΊΒΕͳ͍ͱ͍͏ ؾ͕࣋ͪڧ͍
32. ͓·͚
33. WVFMPBEFSར༻ͷ7VFKTͰ΋ ಉ͘͡Β͍खܰͰ͸ʁ
34. μϝͩͬͨ IUUQRJJUBDPNEFWOFLPJUFNTBBCCDC
35. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠