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

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

265edb69bfcd5cac012ad5a14f2e6e2f?s=47 OSCA
June 02, 2017

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

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

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

265edb69bfcd5cac012ad5a14f2e6e2f?s=128

OSCA

June 02, 2017
Tweet

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 •  .JDSPTPGU4JMWFSMJHIU •  "EPCF"JS
  14. 8&#ΠϯλʔϑΣʔε © OSCA •  )5.-υϥϑτ •  "QQMF J1IPOF(ൃച

    •  "QQMF J1IPOF 4BGBSJ Ͱ'MBTIͷඇରԠΛൃද •  )5.-קࠂ •  )5.-קࠂ
  15. 8&#ΠϯλʔϑΣʔε © OSCA )5.- • QJDUVSF • JOQVUUZQFlEBUFUJNFMPDBMzʙ • JOQVUUZQFlXFFLzʙ

    • JOQVUUZQFlNPOUIzʙ • Πϕϯτ 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λά • JOQVUUZQFlEBUFUJNFMPDBMzʙ • JOQVUUZQFlXFFLzʙ • JOQVUUZQFlNPOUIzʙ

  18. 8&#ΠϯλʔϑΣʔε © OSCA )5.-

  19. 8&#ϒϥ΢β © OSCA •  *OUFSOFU&YQMPSFS  •  *OUFSOFU&YQMPSFS

     •  *OUFSOFU&YQMPSFS  ೥ʹ91޲͚αϙʔτ׬શऴྃ •  .P[JMMB'JSFGPY •  "QQMF4BGBSJ •  *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 • ೥  &$."4DSJQUTU&EJUJPO •

    ೥  &$."4DSJQUOE&EJUJPO • ೥  &$."4DSJQUSE&EJUJPO • ೥  &$."4DSJQUUI&EJUJPO • ೥  &$."4DSJQUUI&EJUJPO  • ೥  &$."4DSJQU&EJUJPO • ೥  &$."4DSJQU&EJUJPO ࡦఆத
  24. ΫϥΠΞϯταΠυɾεΫϦϓτ © OSCA +BWB4DSJQU • ೥  +BWB4DSJQU&$."4DSJQUTU OE •

    ೥  +BWB4DSJQU&$."4DSJQUSE • ೥  +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 ࣍ͷٕज़ʹΑΓɺ)551YΑΓ΋௨৴͕ߴ଎ʹͳΔɻ • )551ϔομͷѹॖ •

    164)௨৴ • )551ύΠϓϥΠϯ • )FBEPG-JOF )P- ϒϩοΩϯά໰୊ͷղফ )551͸ɺ)5514 )551PWFS5-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ݻఆ • ೥  "8471$ ϓϥΠϕʔτωοτϫʔΫ • ೥  "84౦ژϦʔδϣϯ։ઃ
  33. αʔόʔ © OSCA Ϋϥ΢υ࣌୅ʹͳͬͯมΘͬͨ͜ͱ • αʔόʔΠϯελϯε͸࢖͍ࣺͯʹ • "1*ܦ༝ͰωοτϫʔΫ΍αʔόʔ͕ߏஙͰ͖Δ

  34. αʔόʔ © OSCA Ϋϥ΢υ࣌୅ͷΩʔϫʔυ • *OGSBTUSVDUVSFBT$PEF • *NNVUBCMF*OGSBTUSVDUVSF • #MVF(SFFO%FQMPZNFOU

  35. ։ൃ؀ڥͷมԽ © OSCA όʔδϣϯ؅ཧγεςϜ όʔδϣϯ؅ཧγεςϜ͸෼ࢄܕ͕ओྲྀʹͳͬͨɻ • $74 • 4VCWFSTJPO •

    (JU .FSDVSJDBM ϗεςΟϯάαʔϏε͕ొ৔ͨ͠ɻ • (JU)VC • #JU#VDLFU • 7JTVBM4UVEJP5FBN4FSWJDFT
  36. ։ൃ؀ڥͷมԽ © OSCA ґଘؔ܎ͷղܾγεςϜ ΄ͱΜͲͷϓϩάϥϛϯάݴޠʹɺґଘϥΠϒϥϦͷղܾγ εςϜ͕ొ৔ͨ͠ɻ • .BWFO (SBEMF +BWB

    • #VOEMFS 3VCZ • $PNQPTFS 1)1 • $1"/ 1FSM
  37. ։ൃ؀ڥͷมԽ © OSCA ܧଓతΠϯςάϨʔγϣϯσϓϩΠ લड़ͷΑ͏ͳπʔϧͷొ৔ʹΑΓ • ϏϧυϓϩηεͷࣗಈԽ͕༰қʹͳͬͨɻ • Ϗϧυ΍σϓϩΠͷ͕࣌ؒ୹ॖ͞Εͨɻ

  38. © OSCA ·ͱΊ

  39. ࣍ճҎ߱ͷൃදީิ © OSCA ٕज़ωλ • )5.- • ".1 • "MU+4

    ։ൃϓϩηε • ։ൃϓϩηεͷࣗಈԽ ಇ͖ํ • ΤϯδχΞͷΩϟϦΞύε
  40. © OSCA օ͞ΜͷൃදΛ͓଴ͪͯ͠·͢ɻ