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

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

7919a30bc59113c94f31676158cb5881?s=47 irof
February 17, 2017

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

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

7919a30bc59113c94f31676158cb5881?s=128

irof

February 17, 2017
Tweet

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 /PEFKT1BDLBHF.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 ࠓճͷؔδϟό͸ʮϑϩϯτΤϯ υʯͬͯ୊͚ͨ͠ͲɺͲ͔͜Βϑϩ ϯτΤϯυͳͷ͔Α͘Θ͔Γ·ͤΜ