WEBエンジニア勉強会 #01 (開会〜発表1)

2017年06月02日(金)に開催された「WEBエンジニア勉強会 #01」の開会〜発表1「2000年以降のWEBを振り返り、近年のWEBのキーワードに触れてみる 」までの発表資料です。

[イベントHP]
https://connpass.com/event/57201/

Transcript

1. 8&#ΤϯδχΞษڧձ 
2. 8&#ΤϯδχΞษڧձ © OSCA ໨త • 8&#ٕज़ͷڞ༗ͱֶश • ීஈͷऔΓ૊ΈΛൃදͰ͖Δ৔ͷఏڙ • 8&#ΤϯδχΞͷ༑ୡ΍஥ؒΛ࡞Δ
3. ձ৔Ҋ಺ 
   ॾ஫ҙ © OSCA • τΠϨ͸࿓Լʹ͋Γ·͢ɻ • ېԎʹ͝ڠྗ͍ͩ͘͞ɻ • ͜ͷି͠ձٞࣨͷແྉ 8J'J
   ͕ར༻Ͱ͖·͢ɻ • ҿ৯͸ࣗ༝Ͱ͢ɻ • ࢀՃඅԁΛ͓ࢧ෷͍͍ͩ͘͞ɻ • '͸ֶशक़ɾ'͸ࣗशࣨͰ͢ɺ૽Իʹ഑ྀئ͍͠·͢ɻ • ࿓ԼͰͷ௨࿩͸͝ԕྀ͍ͩ͘͞ɻ • ϚΠΫ͕ར༻Ͱ͖·ͤΜɺྃ͝ঝ͍ͩ͘͞ɻ
4. ओ࠵ऀ ࣗݾ঺հ © OSCA 04$"
   
   ᖛ໺ Ұೋࡾ ͸·ͷ ͔ͣ;Έ 4*FS ϓϩδΣΫτϦʔμʔ • +BWB
   1)1 • αʔόʔαΠυΤϯδχΞ • ࠷ۙ͸ਓ޻஌ೳ "*
   ػցֶशΛษڧத • ͘͞Βͷ714आΓͯ8&#αʔϏεΛӡӦ • ໷ܠࣸਅՈ • ෣඿ࡏॅ
5. ओ࠵ऀ ࣗݾ঺հ © OSCA 04$"
   
   ᖛ໺ Ұೋࡾ ͸·ͷ ͔ͣ;Έ 4*FS ϓϩδΣΫτϦʔμʔ ᖛ໺ ౦ژ ࣗࣾ ϕτφϜ ԭೄ ސ٬ தࠃਓνʔϜ
6. ओ࠵ऀ ࣗݾ঺հ © OSCA 04$"
   
   ᖛ໺ Ұೋࡾ ͸·ͷ ͔ͣ;Έ 4*FS ϓϩδΣΫτϦʔμʔ ᖛ໺ ౦ژ ࣗࣾ ϕτφϜ ԭೄ ސ٬ ओͳ࢓ࣄ • ސ٬ંি • ࢓༷ௐ੔ • ϕϯμʔϚωʔδϝϯτ தࠃਓνʔϜ
7. 8&#ΤϯδχΞษڧձ © OSCA 04$"
   
   ᖛ໺ Ұೋࡾ ͸·ͷ ͔ͣ;Έ 4*FS ϓϩδΣΫτϦʔμʔ ࡀఆ೥આ • தؒ؅ཧΛձࣾʹٻΊΒΕɺΤϯδχΞͰ͖ͳ͍ɻ • ྑ͍ޙഐΛҭͯΔɾྑ͍ϏδωεύʔτφʔΛ࣋ͭ͜ͱ ͕ධՁʹͭͳ͕Δɻ • ͲΜͲΜपΓ͔Βʮٕज़͕޷͖ʯͱ͍͏ਓ͕͍ͳ͘ͳͬ ͍ͯ͘ɻ
8. 8&#ΤϯδχΞษڧձ © OSCA 04$"
   
   ᖛ໺ Ұೋࡾ ͸·ͷ ͔ͣ;Έ 4*FS ϓϩδΣΫτϦʔμʔ ૝͍ • ΤϯδχΞͱͯ͠΋ݱ໾Ͱ͍͍ͨ • ΤϯδχΞͰډଓ͚ΒΕΔํ๏Λ໛ࡧ͍ͨ͠ • ΤϯδχΞͷ͓༑ୡཉ͍͠ • ޙഐ΍एऀʹ஌ࣝΛڞ༗͍ͨ͠
9. 8&#ΤϯδχΞษڧձ © OSCA ࠓ೔ͷൃද ̎̌̌̌೥Ҏ߱ͷ8&#ΛৼΓฦΓɺ ۙ೥ͷ8&#ͷΩʔϫʔυʹ৮ΕͯΈΔ !FOHJOFFS@PTDB 0"VUI
   
   Λ͔Έͩ͘͘ !HBSCBHFUPXO XFCΤϯδχΞॳ৺ऀΛεϜʔζʹड͚ೖΕΔͨΊʹ ϨΨγʔΞϓϦέʔγϣϯͷΞʔΩςΫτͱͯ͠౒ྗ ͍ͯ͠Δ͜ͱ !OBCFEHF
10. 8&#ΤϯδχΞษڧձ © OSCA ࠓ೔ͷ-5 • ΤϯδχΞʹͳͬͯϲ݄ܦͬͯࢥ͏͜ͱ !BLND[ • ࣾ಺ͰϑϨʔϜϫʔΫΛ޿͛Δ·Ͱ ![VDLFZ@ • େاۀͰ΋8&#ΤϯδχΞϦϯά͕͍ͨ͠
    !SFOKJLBSJ
11. OSCA (濱野 一二三) ೥Ҏ߱ͷ8&#ΛৼΓฦΓɺ ۙ೥ͷ8&#ͷΩʔϫʔυʹ৮ΕͯΈΔ
12. 8&# © OSCA ブラウザ サーバー HTTPリクエスト HTTPレスポンス
13. 8&#
    ΠϯλʔϑΣʔε © OSCA • 
     )5.-קࠂ • 
     9)5.-קࠂ • 
     9)5.-קࠂ • 
     "DUJPO4DSJQU
     • 
     8&#"KBY
    ςΟϜɾΦϥΠϦʔ • 
     "EPCF͕.BDSPNFEJBΛങऩ
    "DUJPO4DSJQU
     • 
     .JDSPTPGU
    4JMWFSMJHIU • 
     "EPCF
    "JS
14. 8&#
    ΠϯλʔϑΣʔε © OSCA • 
     )5.-υϥϑτ • 
     "QQMF
    J1IPOF
    (ൃച • 
     "QQMF
    J1IPOF 4BGBSJ Ͱ'MBTIͷඇରԠΛൃද • 
     )5.-קࠂ • 
     )5.-קࠂ
15. 8&#
    ΠϯλʔϑΣʔε © OSCA )5.-
     • QJDUVSF • JOQVU
    UZQFlEBUFUJNFMPDBMz
    ʙ • JOQVU
    UZQFlXFFLz
    ʙ • JOQVU
    UZQFlNPOUIz
    ʙ • Πϕϯτ PODVU
    PODPQZ
    POQBTUF ͷ௥Ճ
16. 8&#
    ΠϯλʔϑΣʔε © OSCA )5.-
    
    QJDUVSFλά <picture> <source media="(max-width: 600px)" srcset="blue.png"> <source media="(max-width: 900px)" srcset="green.png"> <img src="pink.png"> </picture>
17. 8&#
    ΠϯλʔϑΣʔε © OSCA )5.-
    
    JOQVUλά • JOQVU
    UZQFlEBUFUJNFMPDBMz
    ʙ • JOQVU
    UZQFlXFFLz
    ʙ • JOQVU
    UZQFlNPOUIz
    ʙ
18. 8&#
    ΠϯλʔϑΣʔε © OSCA )5.-
    
19. 8&#ϒϥ΢β © OSCA • 
     *OUFSOFU&YQMPSFS  • 
     *OUFSOFU&YQMPSFS  • 
     *OUFSOFU&YQMPSFS 
    ೥ʹ91޲͚αϙʔτ׬શऴྃ • 
     .P[JMMB
    'JSFGPY • 
     "QQMF
    4BGBSJ • 
     *OUFSOFU&YQMPSFS  • 
     (PPHMF
    $ISPNF • 
     *OUFSOFU&YQMPSFS  • 
     *OUFSOFU&YQMPSFS  • 
     *OUFSOFU&YQMPSFS  • 
     *OUFSOFU&YQMPSFS  • 
     &EHF
20. 8&#ϒϥ΢β © OSCA ϒϥ΢βංେԽ໰୊ ϒϥ΢βʹඞཁͳػೳͱ͸ͳΜͳͷ͔ʁ • 8FC
    #MVFUPPUI
    "1* • (BNFQBE
    "1* • 8FC
    .*%*
    "1*
21. 8&#ϒϥ΢β © OSCA
22. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA ECMAScript JavaScript 実装 言語仕様
23. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA &$."4DSJQU
    &4 • ೥  &$."4DSJQU
    TU
    &EJUJPO • ೥  &$."4DSJQU
    OE
    &EJUJPO • ೥  &$."4DSJQU
    SE
    &EJUJPO • ೥  &$."4DSJQU
    UI
    &EJUJPO • ೥  &$."4DSJQU
    UI
    &EJUJPO
     • ೥  &$."4DSJQU
    
    &EJUJPO • ೥  &$."4DSJQU
    &EJUJPO
    
    ࡦఆத
24. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA +BWB4DSJQU • ೥  +BWB4DSJQU
    
    
    &$."4DSJQU
    TU OE • ೥  +BWB4DSJQU
    
    
    &$."4DSJQU
    SE • ೥  +BWB4DSJQU
    
25. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA ECMAScript JavaScript 実装 言語仕様 TypeScript 拡張実装言語 (Super set) コンパイル CoffeeScript
26. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA ECMAScript JavaScript 実装 言語仕様 TypeScript 拡張実装言語 (Super set) コンパイル CoffeeScript AltJS
27. ௨৴ )551
    )5514 © OSCA )551 • ೥  )551 • ೥  )551 • ೥  )551 • ೥  )551 )5514 • 44-5-4
    Ͱ҉߸Խ͞Εͨ)551௨৴
28. ௨৴ )551
    )5514 © OSCA )551 ࣍ͷٕज़ʹΑΓɺ)551
    Y
    ΑΓ΋௨৴͕ߴ଎ʹͳΔɻ • )551ϔομͷѹॖ • 164)௨৴ • )551ύΠϓϥΠϯ • )FBE
    PG
    -JOF
    )P-
    ϒϩοΩϯά໰୊ͷղফ )551͸ɺ)5514
    )551
    PWFS
    5-4
    ௨৴͕લఏɻ
29. ௨৴ )551
    )5514 © OSCA )551 )551αʔόʔͷରԠঢ়گ • "QBDIF
    ʙ • OHJOY ʙ • **4
    8JOEPXT
    
    ʙ ϒϥ΢βͷରԠঢ়گ • (PPHMF
    $ISPNF
    ʙ • .P[JMMB
    'JSFGPY
    ʙ • *OUFSOFU
    &YQMPSFS
    ʙ 
    .JDSPTPGU
    &EHF
30. ௨৴ )551
    )5514 © OSCA -FU`T
    &ODSZQU
31. ௨৴ )551
    )5514 © OSCA -FU`T
    &ODSZQU • αʔόʔ্ͰɺίϚϯυϥΠϯͰূ໌ॻͷൃߦཁٻΛߦ͏ɻ • ൃߦ͞ΕΔূ໌ॻͷλΠϓ͸%7ূ໌ॻɻ • ൃߦ͞ΕΔূ໌ॻͷ༗ޮظݶ͸ϲ݄ɻ • ίϚϯυΛDSPOͳͲʹొ࿥ͯ͠ɺ༗ޮظݶ੾ΕʹͳΓͦ ͏ͩͬͨΒࣗಈతʹߋ৽͢ΔΑ͏ʹ͢Δɻ
32. αʔόʔ © OSCA αʔόʔ؀ڥͷมԽ • ϗεςΟϯά • Ծ૝αʔόʔ 7.8BSF
    7JSUVBM4FSWFS
    9FO • Ϋϥ΢υ • ೥  "84
    &$
    ЌαʔϏε։࢝ • ೥  "84
    &MBTUJD
    *1
    ͷొ৔ άϩʔόϧ*1ݻఆ • ೥  "84
    71$
    ϓϥΠϕʔτωοτϫʔΫ • ೥  "84
    ౦ژϦʔδϣϯ։ઃ
33. αʔόʔ © OSCA Ϋϥ΢υ࣌୅ʹͳͬͯมΘͬͨ͜ͱ • αʔόʔΠϯελϯε͸࢖͍ࣺͯʹ • "1*ܦ༝ͰωοτϫʔΫ΍αʔόʔ͕ߏஙͰ͖Δ
34. αʔόʔ © OSCA Ϋϥ΢υ࣌୅ͷΩʔϫʔυ • *OGSBTUSVDUVSF
    BT
    $PEF • *NNVUBCMF
    *OGSBTUSVDUVSF • #MVF(SFFO
    %FQMPZNFOU
35. ։ൃ؀ڥͷมԽ © OSCA όʔδϣϯ؅ཧγεςϜ όʔδϣϯ؅ཧγεςϜ͸෼ࢄܕ͕ओྲྀʹͳͬͨɻ • $74 • 4VCWFSTJPO • (JU 
    .FSDVSJDBM ϗεςΟϯάαʔϏε͕ొ৔ͨ͠ɻ • (JU)VC • #JU#VDLFU • 7JTVBM
    4UVEJP
    5FBN
    4FSWJDFT
36. ։ൃ؀ڥͷมԽ © OSCA ґଘؔ܎ͷղܾγεςϜ ΄ͱΜͲͷϓϩάϥϛϯάݴޠʹɺґଘϥΠϒϥϦͷղܾγ εςϜ͕ొ৔ͨ͠ɻ • .BWFO
    (SBEMF +BWB • #VOEMFS
    3VCZ • $PNQPTFS
    1)1 • $1"/
    1FSM
37. ։ൃ؀ڥͷมԽ © OSCA ܧଓతΠϯςάϨʔγϣϯσϓϩΠ લड़ͷΑ͏ͳπʔϧͷొ৔ʹΑΓ • ϏϧυϓϩηεͷࣗಈԽ͕༰қʹͳͬͨɻ • Ϗϧυ΍σϓϩΠͷ͕࣌ؒ୹ॖ͞Εͨɻ
38. © OSCA ·ͱΊ
39. ࣍ճҎ߱ͷൃදީิ © OSCA ٕज़ωλ • )5.-
     • ".1 • "MU+4 ։ൃϓϩηε • ։ൃϓϩηεͷࣗಈԽ ಇ͖ํ • ΤϯδχΞͷΩϟϦΞύε
40. © OSCA օ͞ΜͷൃදΛ͓଴ͪͯ͠·͢ɻ