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

Webフロントエンド開発のこれまでと現在

 Webフロントエンド開発のこれまでと現在

#946oss 勉強会の資料です
https://946oss.connpass.com/event/256319/

Keisuke SATO

August 18, 2022
Tweet

More Decks by Keisuke SATO

Other Decks in Technology

Transcript

  1. ,FJTVLF4BUP
    8FCϑϩϯτΤϯυ։ൃͷ
    ͜Ε·Ͱͱݱࡏ
    ۴࿏044ษڧձʮ8FCϑϩϯτΤϯυೖ໳ʯ

    View full-size slide

  2. ͜ͷ࿩ͷΰʔϧ
    ฉ͘ͻͱ͕ΤϯδχΞͱ͸ݶΒͳ͍͠ɺٕज़΋஌Βͳ͍લఏͰ࢝ΊΑ͏
    w ۴࿏044ษڧձͰʮ8FCϑϩϯτΤϯυʯͬͯݴͬͨͱ͖ͷೝࣝΛ߹ΘͤΔ
    w ࣍ͷʮ͜Ε͔Β࢝ΊΔʯ࿩ʹܨ͕ΔΑ͏ʹɺ·ͣ͸ʮ͜Ε·ͰʯΛͬ͘͞Γ
    ஌Δ
    w ͜Ε͔ΒΑ͘ग़ͯ͘ΔͰ͋Ζ͏୯ޠʹܰ͘৮ΕΔ
    w ٯʹ࿩Λ΍΍͘͜͠͠ͳ͍Α͏ɺ͋͑ͯશ͘৮Εͳ͍෦෼΋ଟͦ͏ͳ༧ײ

    View full-size slide

  3. 8FCϑϩϯτΤϯυ

    View full-size slide

  4. 8FCϑϩϯτΤϯυ
    ʮϑϩϯτΤϯυʯͱݴͬͯ͠·͏ͱͪΐͬͱ޿͗͢ΔͷͰͶ

    View full-size slide

  5. ࠓճ͸ϒϥ΢βͰݟ͍͑ͯΔ΋ͷͱ͍͏ҙຯͰ
    w Կ͔͠Βͷ΢ΣϒαʔϏεɾϖ
    ʔδʹ͓͍ͯɺϢʔβʔ͕΢Σϒ
    ϒϥ΢βܦ༝Ͱද͍ࣔͯ͠Δί
    ϯςϯπͷ෦෼
    8FCϑϩϯτΤϯυ

    View full-size slide

  6. w αʔόʔ͔Βऔಘͨ͠)5.-
    $44+4Λղऍͯ͠ਓ͕ݟ΍͢
    ͍ܗʹ͢Δ΋ͷ
    w (PPHMF$ISPNF4BGBSJ
    &EHF'JSFGPYͱ͔
    ΢Σϒϒϥ΢β
    ຊ೔ͷϝΠϯొ৔ਓ෺
    8FCαʔϏεͷٕज़͸ɺ͍͔ʹ͍ͭ͜ΒΛ͏·͘࢖͏͔
    ͱ͍͏ͱ͜ΖΛΈΜͳͰؤு͖ͬͯͨͱݴͬͯ΋աݴͰ͸ͳ͍͔΋ɻ
    ݫີʹ͍͏ͱαʔόʔʹݶΒͳ͍͚ͲͶ

    View full-size slide

  7. ΢Σϒϒϥ΢β

    View full-size slide

  8. ΍΍ݹ͍8FCαʔϏεͷߏ੒
    ·ͩ+BWB4DSJQU͸Ϛ΢εΧʔιϧΩϥΩϥͤͨ͞Γͱ͔ʹ࢖ΘΕͯͨΑͶ
    )5.-
    αʔόʔͰϖʔδΛؙ͝ͱੜ੒ͯ͠Ϣʔβʔʹฦ͢

    View full-size slide

  9. গ͠ਐาͨ͠8FCαʔϏεͷߏ੒
    (NBJMͱ͔(PPHMF.BQTͱ͔͕ग़͖ͯͨ"KBY࣌୅
    ϖʔδΛදࣔ͢ΔͷʹɺԿ౓͔ϦΫΤετͨ͠Γ
    ϘλϯΛԡͨ࣌͠ͱ͔ʹϖʔδભҠͤͣʹߋ৽ͨ͠Γ

    View full-size slide

  10. ΋͏গ͠ਐาͨ͠8FCαʔϏεͷߏ੒
    K2VFSZͰͪ·ͪ·ॻ͘ͷ͸ਏ͔ͬͨ
    ,OPDLPVUKT #BDLCPOFKT &NCFSKT "OHVMBS+4
    ͳͲͷϑϨʔϜϫʔΫ͕࢖ΘΕ࢝ΊΔ

    View full-size slide

  11. ൺֱత࠷ۙͷ8FCαʔϏεͷߏ੒
    ϒϥ΢βଆͰ΍Δ͜ͱଟ͍͔ΒɺͦΕલఏʹ
    ϖʔδભҠͷॲཧ͢Β΋ΫϥΠΞϯτଆͰ΍ͬͨΓ
    ࣗಈͰදࣔ಺༰͕ߋ৽͞ΕͨΓ
    ͲΜͲΜϦονʹ
    ωοτϫʔΫ͕ශऑͳʢ৔߹΋͋ΔʣεϚϗͷීٴ΋ҰҼ
    αʔόʔαΠυͷॲཧΛ଴ͭΑΓɺωοτϫʔΫ͕Өڹ͠ͳ͍
    ୺຤ଆͰॲཧΛ͍ͨ͠χʔζ
    αʔόʔαΠυ͸ɺ+40/΍
    (SBQI2-Λѻ͏͚ͩͷଘࡏʹ

    View full-size slide

  12. มԽ͕ͱͯ΋ૣ͍෼໺

    View full-size slide

  13. lϑϩϯτΤϯυΤϯδχΞz
    ͜ͷݺ͹Εํɺ͜͜೥͘Β͍ͷ࿩͔΋
    w ͻͱੲલ͸ɺαʔόʔαΠυͰ)5.-Λ૊Έཱ͍ͯͯͨਓ͕ͦΕʹ͍ۙ
    w ೥લ͘Β͍ʹ3FBDU+4͕ొ৔ͯ͠Ұؾʹ޿·ͬͨײʢݸਓతײ૝ʣ
    w ݱࡏ͸ɺϒϥ΢βͰಈ͘ίʔυΛॻ͘ਓͷ͜ͱΛ͍͏͜ͱ͕ଟͦ͏
    w ͦͷதͰ΋σΩΔਓ͸ɺαʔόʔαΠυͷίʔυ΋ಡΈॻ͖Ͱ͖Δ
    w දࣔͷमਖ਼Ͱ"1*ͷमਖ਼͕ඞཁʹͳΔ͜ͱ΋Α͋͘ΔͷͰ
    w ࢖͏ٕज़ݴޠͷҠΓมΘΓ

    View full-size slide

  14. ࣍͸ʮ͜Ε͔Β࢝ΊΔʹ͸ʯͱ͍͏࿩

    View full-size slide