フロントエンドわからないけど画面つくることになって

[関ジャバ] フロントエンド初心者勉強会 in 大阪のLTです。
https://kanjava.connpass.com/event/49104/

Transcript

1. ϑϩϯτΤϯυΘ͔Βͳ͍ ͚Ͳը໘࡞Δ͜ͱʹͳͬͯ <ؔδϟό>
   ϑϩϯτΤϯυॳ৺ऀษڧձ
   JO
   େࡕ
   5
   !JSPG
2. എܠͱͯࣗ͠ݾ঺հ w ͍Ζ;Ͱ͢ɹɹɹɹɹɹɹ͜Εˠ
   w େن໛4*FS಺Ͱੜ͖ͯ·ͨ͠
   w αʔόʔαΠυ+BWBͳਓͰ͢
   w +BWB4DSJQU͸ͨ·ʹ͚ͩͲ*&ҎԼུ
   w )5.-ͱ͔$44ͱ͔ԿͦΕ
3. എܠͱͯ͠ܦҢ ʮը໘͸ద౰ʹ࡞ͬͯɻ
 ɹ"ENJO-5&ͱ͔࢖ͬͯɻʯ
   ͓ɺ͓͏ʜʜ
   ʮద౰Ͱ͍͍͔ΒXXXʯ
   ͋ɺ͸͍ʜʜ
4. ࢲͷϑϩϯτΤϯυྗ w #PPUTUSBQ͸5XJUUFS#PPUTUSBQͱ͔ ݴͬͯͨ͜Ζʹ৮ͬͨʢඇۀ຿
   w K2VFSZॻ͚ͱݴΘΕΔͱάάΔ
   w )5.-ͱ͔$44ͱ͔ݴ༿͚ͩ஌ͬ ͯΔʢ໊લग़ͨࠒʹ
5. Ͳͳ͍ͤʔͱʜʜ
6. ͱͳΔਓଟ͍ΑͶʂʁ
 ʢؔδϟόͩ͠ʂʂʣ
7. ର৅ͷ֓ཁ w 4QSJOH
   .7$
   
   5IZNFMFBGΛ࢖͏
   w ը໘͸޷͖ʹͰ͖ΔˡԿ΋ܾ·ͬͯͳ͍
   w Ϣʔβʔ͸਺ਓʢإΛ֮͑ΕΔఔ౓
   w ͕࣌ؒͳ͍ˡ͍ͭͩͬͯ࣌ؒ͸༗ݶͩ͠
8. ৚݅ͱํ਑ w ͋Δఔ౓ݟӫ͑Λ੔͑Δඞཁ͸͋Δ
   w ࣗ෼Ͱ+BWB4DSJQU$44͸ॻ͔ͳ͍
   w "ENJO-5&ͱ͔ͬͯݴͬͯͨ͠ "ENJO-5&ͱ͔ݴ͏΋ͷΛ࢖͓͏ʂ
9. ࢥ͍͍ͭͨબ୒ࢶ w ϓϩδΣΫτʹෲ࣋ͪ͢Δ
   w $%/Λ࢖͏
   w 8FC+BSTΛ࢖͏
   w 8FCQBDLΛ࢖͏
10. ϓϩδΣΫτͰෲ࣋ͪ w μ΢ϯϩʔυͨ͠[JQղౚͨ͠ͷΛશ෦࣋ͬͯ ͓͘ܗ
    w த਎ͷେ൒͸࢖Θͳ͍ʁʢEJTU͚ͩͰ͓Lʁ
    w ͚ͲɺͲΕ͕͍Δͷ͔Θ͔Βͳ͍
    w ͱ͸ݴ͑ɺཁΒΜ΋ͷΛ4$.ʹೖΕͨ͘ͳ͍ ͳ͠
    झຯʹ߹Θͳ͍
11. $%/ w ͳΜ͔͍ͬͺ͍͋Δ
    w ͲΕ࢖͑͹͍͍͔Θ͔Βͳ͍
    w ͔ͯແྉͷ͸ຊ൪Ͱ࢖ͬͯେৎ෉ʁ ͳ͠
    ։ൃͷΈͰ࢖͏
12. ͯ͜ͱͰೋ୒ w 8FC+BST
    w l͸͡Ίͯͷ4QSJOH#PPUzͰݟͨʂ
    w 8FCQBDL
    w ͸͡Ί·ͯ͠ʢ୭ʁ
13. 8FC+BST w .BWFO
    $FOUSBMͷ+4$44Λ࢖͑Δ Α͏ʹͳΔ΍ͭ
14. 8FC+BST .BWFO
    $FOUSBM /1. #PXFS ࢲͷΞϓϦέʔγϣϯ ࢖͍͍ͨ+4$44 ࢲʹ΍͍͞͠ੈք ࢲͷ஌Βͳ͍ੈք (SBEMF CVJMEHSBEMF ͜͜ʹདྷΕ͹উͬͨΑ͏ͳ΋ͷ
15. w 8FC+BST׬શʹϚελʔͨ͠
16. 8FCQBDL w )5.-ʹAMJOLAͱ͔ATDSJQUAͱ͔ ฒ΂ͳͯ͘ࡁΉΑ͏ʹͳΔ΍ͭ
    w )5.-ͷ࠷ޙʹATDSJQUAΛҰͭॻ ͚ͩ͘ͰࡁΉ
17. 8FCQBDLΛ࢖͏ʹ͸ʜʜ w OQN͕લఏ
    w ͦ΋ͦ΋OQN͠Βͳ͍
18. OQN w /PEFKT
    1BDLBHF
    .BOBHFSʁ
    w ·͋ґଘղܾͯ͘͠ΕΔ΍ͭͳΜͩ Ζ͏͖ͬͱʢଞʹ΋৭ʑͰ͖ΔΈͨ ͍͚ͩͲ
19. OQN ࢖͍͍ͨ+4$44 /1. OQN OPEF@NPEVMFT QBDLBHFKTPO
20. w OQN׬શʹϚελʔͨ͠
21. 8FCQBDL ·ͱΊͨ+BWB4DSJQU XFCQBDL OPEF@NPEVMFT XFCQBDLDPOGJHKT
    ΤϯτϦϙΠϯτͷKT
22. w 8FCQBDL׬શʹϚελʔͨ͠
23. ϓϩδΣΫτͰ࣋ͭ΋ͷ w ϑΝΠϧͰࡁΉͷ͸·ͣ·ͣ
    w ΤϯτϦϙΠϯτͷKTͱQBDLBHFKTPOʹ࢖͏ϥΠϒ ϥϦΛ΄΅ಉ͡಺༰Ͱॻ͖ฒ΂Δ͜ͱʹʢඇ%3:ʣ
    w Ϗϧυͷεςοϓ͕Ұͭ૿͑Δ ├── app │ └── index.js ├── package.json └── webpack.config.js ͳ͠
    +4ॻ͔ͳ͍ͷͰա৒
24. ͯ͜ͱͰ w ࠓճ͸8FC+BSTͰʂ
25. ͍͖ͳΓࠔͬͨ w ηϯτϥϦϧϙδτϦʹ࢖͍͍ͨόʔ δϣϯ͕ͳ͍Αʜʜ
26. 8FC+BST .BWFO
    $FOUSBM /1. #PXFS ࢲͷΞϓϦέʔγϣϯ ࢖͍͍ͨ+4$44 ࢲʹ΍͍͞͠ੈք ࢲͷ஌Βͳ͍ੈք (SBEMF CVJMEHSBEMF ͜Ε͠ͳ͍ͱ࢖͑ͳ͍
27. ࣗ෼ͰσϓϩΠͰ͓L
28. w 8FC+BST׬શʹϚελʔͨ͠ʢ࠶
29. ͱ͜ΖͰ w ࠓճͷؔδϟό͸ʮϑϩϯτΤϯ υʯͬͯ୊͚ͨ͠ͲɺͲ͔͜Βϑϩ ϯτΤϯυͳͷ͔Α͘Θ͔Γ·ͤΜ