AbemaTV ホンネテレビ の本音

2018/03/09 Frontrend Vol.11 - 2017年度フロントエンド大反省会

Transcript

1. AbemaTV #ϗϯωςϨϏ ͷຊԻ 2018/03/09 Frontrend Vol.11 - 2017೥౓ϑϩϯτΤϯυେ൓লձ @ktknest
2. גࣜձࣾαΠόʔΤʔδΣϯτ
 גࣜձࣾ"CFNB57
   ։ൃຊ෦
   Ճ౻
   ݡҰ ϓϩϑΟʔϧ 
    த్ೖࣾ
   ओʹঁੑ޲͚ϝσΟΞαʔϏεͷ্ཱͪ͛Λ୲౰
 "CFNB57ʹग़޲
3. AbemaTV ແྉͰָ͠ΊΔΠϯλʔωοτςϨϏہ ΦϦδφϧͷੜ์ૹίϯςϯπ΍ɺχϡʔεɺ ԻָɺεϙʔπɺυϥϚͳͲଟ࠼ͳ൪૊ָ͕͠ ΊΔ໿νϟϯωϧΛશͯແྉͰఏڙ͍ͯ͠ ·͢ɻ
   ʮ"CFNBϏσΦʯͰ͸ɺ"CFNB57ͷ์ૹͰ ݟಀͨ͠൪૊ΛҰఆظ͍ؒͭͰ΋ɺ޷͖ͳ࣌ ʹݟ์୊ʹͳΔ΄͔ɺΦϦδφϧ੍࡞ͷ൪૊ Λ͸͡ΊɺҰ෦ͷ൪૊͸ొ࿥͢Δ͜ͱͳ͘ແ ྉͰ΋ָ͓͠Έ͍͚ͨͩ·͢ɻ
4. 2017೥ ࠷େͷ൓ল఺ ʊਓਓਓਓਓਓਓਓਓਓʊ
   ʼɹαʔόʔμ΢ϯɹʻ
   ʉ:?:?:?:?:?:?:?:ʉ 
   ʰُాڵؽʹউͬͨΒສԁʱ
5. 2017೥ ৼΓฦΓ 
   
   
   
   
   
   
   
   
    "CFNB57։ہ
   "CFNBϏσΦ
   ϦϦʔε
   ʰُాڵؽʹউͬͨΒສԁʱ์ૹ
 ʰୈظ
   ཽԦઓܾউτʔφϝϯτ
   ࠤʑ໦༐ؾޒஈ
   ର
   ౻Ҫ૱ଠ࢛ஈʱ์ૹ
   ʰ࣌ؒϗϯωςϨϏʱ์ૹܾఆ
   ʰ࣌ؒϗϯωςϨϏʱ์ૹ
   ৭ʑͳ೥຤೥࢝ಛ൪
6. ࠓճ͸͜ͷ൓ল͔Βɺ ϗϯωςϨϏ΍೥຤೥࢝Λແࣄʹաͨ͢͝Ίʹߦͬͨ ෛՙରࡦΛத৺ʹ͓࿩͠͠·͢ɻ
7. ରࡦ 
   8FCαʔόʔΛࢮͳͤͳ͍
   
   "1*഑৴αʔόʔΛࢮͳͤͳ͍
 
   Τϥʔൃੜ࣌ʹద੾ͳදࣔΛ͢Δ
8. લஔ͖ɿWebߏ੒  ($1্ʹߏங
    #''ʢ/HJOY
   
   /PEFKTʣ  "1*͸ผυϝΠϯ
    41"ʢඇ443ʣ
   ˞ࠨਤ͸ෛՙରࡦޙͷߏ੒
9. લஔ͖ɿ͋ΘͤͯಡΈ͍ͨ .JDSPTFSWJDFTԼʹ͓͚Δ8FCͷෛՙରࡦ
   
   "CFNB57
   %&7&-01&3
   $0/'&3&/$&
   
   IUUQTTQFBLFSEFDLDPNBTVLBMFJEPBCFNBUWEFWFMPQFSDPOGFSFODF
   IUUQTGSFTIMJWFUWUFDIDPOGFSFODF
   ࠒ͔Β ࣌ؒϗϯω57ɺΫϥΠΞϯταΠυ΋ෛՙରࡦ 
   
   $"TXJGU
   
   IUUQTTQFBLFSEFDLDPNSJOPWEJIVJDBTXJGU ϗϯωςϨϏͷෛՙରࡦ഑৴ฤ
   IUUQTRJJUBDPNNJZVLLJJUFNTGEDC "CFNB57Λࢧ͑ΔΞϓϦͷ༏͠͞
   
   "CFNB57
   %&7&-01&3
   $0/'&3&/$&
   
   IUUQTTQFBLFSEFDLDPNPHBDMFKBQBOBCFNBUWEFWDPO
   IUUQTGSFTIMJWFUWUFDIDPOGFSFODF
   ࠒ͔Β ϗϯωςϨϏͷෛՙରࡦϓϩϚωͷϗϯω
   IUUQTEFWFMPQFSTDZCFSBHFOUDPKQCMPHBSDIJWFT
10. ରࡦɿWebαʔόʔΛࢮͳͤͳ͍ 
    μ΢ϯ࣌ʹ໰୊ͷ͋ͬͨՕॴͷݟ௚͠
    
    $%/Խ
11. ରࡦɿWebαʔόʔΛࢮͳͤͳ͍ μ΢ϯ࣌ʹ໰୊ͷ͋ͬͨՕॴͷݟ௚͠ 
    ಺෦ͷH31$௨৴ͰλΠϜΞ΢τ࣌ͷߟྀ࿙Ε
    
     Ԡ౴͕ͳ͍ঢ়ଶ͕ଓ͍ͯ͠·͏ʢ-#ଆ͸λΠϜΞ΢τʣ
     ίωΫγϣϯ͸࢒ͬͨ··ͷͨΊɺੵΈॏͳΔͱίωΫγϣϯ਺ͷݶքಥഁ (PPHMF
    $MPVE
    1MBUGPSN /PEFKT ৘ใऔಘઌͷ
    ϚΠΫϩαʔϏε H31$ ϝλ৘ใΛ෇༩ͨ͠)5.-
12. ରࡦɿWebαʔόʔΛࢮͳͤͳ͍ CDNԽ 
    )5.-ؚΊͨ੩తϑΝΠϧ͸શͯ(PPHMF
    $MPVE
    $%/ܦ༝ʹ͢Δ
     ΦϦδϯαʔόʔʢ/HJOY/PEFKTʣ΁ͷϦΫΤετΛ࠷খݶʹͰ͖Δ
     6"ʹΑΔ഑৴෺ͷৼΓ෼͚͕Ͱ͖ͳ͍ͨΊɺ6"ґଘՕॴΛमਖ਼
     ݱࡏɺ͞Βʹ'BTUMZҠߦΛݕ౼த
13. ରࡦɿAPI/഑৴αʔόʔΛࢮͳͤͳ͍ 
    ഑৴ͷ$%/ʢ"LBNBJʣԽ
    
    ࢹௌ·Ͱʹඞਢͳ"1*Λ࡮৽
    
    ʢෆཁͳcෆཁͳλΠϛϯάͰͷʣϦΫΤετΛ࡟ݮ
    
    ղ૾౓ͷίϯτϩʔϧ
14. ରࡦɿAPI/഑৴αʔόʔΛࢮͳͤͳ͍ ഑৴ͷCDNʢAkamaiʣԽ 
    )-4΍.1&(%"4)ͷϓϨΠϦετΛ$%/͔Βฦ͢
     ηάϝϯτ͸طʹ$%/͔Β഑৴ࡁΈ
     ࢹௌ਺ͷଟ͍൪૊Ͱ͸ΦϦδϯαʔόʔ΁ͷϦΫΤετ͕εύΠΫͯ͠͠·͏
     $%/Խʹ͋ͨͬͯɺϢʔβʔݻ༗৘ใͷຒΊࠐΈ΍ϩά͕औಘͰ͖ͳ͘ͳΔ
     ϥΠηϯεղܾ΍ɺࢹௌʹؔ͢ΔϝτϦΫεૹ৴Λվम ग़యɿϑϩϯτΤϯυΤϯδχΞͷͨΊͷಈըετϦʔϛϯάٕज़جૅ https://ygoto3.com/posts/streaming-technology-basics-for-frontend-engineers/
15. ରࡦɿAPI/഑৴αʔόʔΛࢮͳͤͳ͍ ࢹௌ·ͰʹඞਢͳAPIΛ࡮৽ 
    ͋ΒΏΔՕॴͰ൪૊දΛ࢘Δڊେͳ"1*ʹґଘ
     νϟϯωϧҰཡ΍൪૊৘ใͷࢀরʹར༻
     ࢹௌ͢Δ͚ͩͳΒ͜͜·Ͱ͸ඞཁͳ͍
     ෛՙͷߴ͍Ϣʔβʔࢀরܥͷো֐ʹר͖ࠐ·Ε͔Ͷͳ͍ 
    νϟϯωϧҰཡ΍൪૊৘ใɺࢹௌ਺Λऔಘ͢Δ"1*Λ࡮৽
     ͜ΕΒʹಛԽͨ͠ϚΠΫϩαʔϏεΛ࡞੒
     ඞཁ࠷খݶͷ৘ใΛݸผʹऔಘ
16. ରࡦɿAPI/഑৴αʔόʔΛࢮͳͤͳ͍ ʢෆཁͳ|ෆཁͳλΠϛϯάͰͷʣϦΫΤετΛ࡟ݮ 
    ςϨϏͷࢹௌ·Ͱ͸ඞཁ࠷௿ݶͷϦΫΤετͰߏ੒͢Δ
     τοϓϖʔδɿνϟϯωϧҰཡͷදࣔ
     ςϨϏɿ൪૊ͷࢹௌɺνϟϯωϧͷ੾Γସ͑
     ڊେͳ൪૊ද"1*ͷґଘΛఫڈ 
    ͦͷଞ΋৭ʑ
     ࢹௌ਺΍ίϝϯτ਺ͷऔಘ΋৽"1*ʹҠߦ
     ϙʔϦϯάִؒ΋࠷దԽ
     ཪ൪૊ද΍ίϝϯτҰཡͷऔಘλΠϛϯάΛௐ੔
17. ରࡦɿAPI/഑৴αʔόʔΛࢮͳͤͳ͍ ղ૾౓ͷίϯτϩʔϧ 
    ଳҬͷ࢖͍͗͢μϝ
     ςϨϏฒΈͷࢹௌऀ਺
    º
    ߴϏοτϨʔτ
    ˠ
    ૬౰ͷଳҬΛ઎༗ͯ͠͠·͏ 
    ϓϨΠϠʔαΠζʹ߹Θͤͯղ૾౓ΛՄมʹ͢Δ
     ΞϓϦͰ͸౰ॳ͔Βಋೖ͞Ε͍ͯͨ࢓૊ΈΛɺ8FCʹ΋ಋೖ
     QʙQ૬౰Ͱ੾Γସ͑
18. ରࡦɿΤϥʔൃੜ࣌ͷద੾ͳରԠ 
    ΤϥʔϋϯυϦϯάͷݟ௚͠
    
    ϝϯςφϯεը໘ͷදࣔ
19. ରࡦɿΤϥʔൃੜ࣌ͷద੾ͳରԠ ΤϥʔϋϯυϦϯάͷݟ௚͠ 
    ਖ਼ৗʹऔಘͰ͖Δ͜ͱ͕લఏͷॲཧ͕ଟ͔ͬͨ
     ϨεϙϯεΤϥʔͷ৔߹Ͱ΋ద੾ͳදࣔΛ͢ΔΑ͏ʹશ໘తʹݟ௚͠  ҟৗܥΛ2"νʔϜͰ؆୯ʹ࠶ݱͰ͖ΔΑ͏ɺςετ༻ͷϓϩΩγπʔϧΛ࡞੒
     4FSWJDF
    8PSLFSΛհ͠ɺ೚ҙͷ"1*ΛYYঢ়ଶͱͯ͠࠶ݱ
20. ରࡦɿΤϥʔൃੜ࣌ͷద੾ͳରԠ ϝϯςφϯεը໘ͷදࣔ 
    ࠷ѱμϝͩͬͨ৔߹Ͱ΋ɺϝϯςφϯεը໘Λදࣔͤ͞Δ
     ʮԿ΋දࣔ͞Εͳ͍ʯ͸ઈରʹճආͯ͠ɺެࣜ৘ใͷऔಘઌΛҊ಺
     ඞਢͳ"1*ϦΫΤετ͕ࣦഊɺ΋͘͠͸λΠϜΞ΢τͨ͠৔߹
     8FC͕μϝͱ൑அ͞Εͨ৔߹ʹɺଈ࠲ʹϝϯςφϯε΁ೖΕΔ४උ
21. ݁Ռ https://www.sponichi.co.jp/entertainment/news/2017/11/05/kiji/20171105s00041000500000c.html
22. ͦͷଞɾࡶײ 
    ϗϯωςϨϏͷ์ૹܾఆΛੈؒͱಉ࣌ʹ஌Δ͜ͱʹ
    
     ৘ใ౷੍΋͋ͬͯɺࣄલʹ஌Β͞Ε͍ͯͨͷ͸ۃҰ෦
     ݩʑɺ೥຤೥࢝૝ఆͰෛՙରࡦΛ࣮ࢪ͢Δ༧ఆͩͬͨͨΊɺલ౗͠ʹͯ͠ᬏਐ 
    ์ૹத͸࣌ؒʴЋͷγϑτମ੍Ͱ؂ࢹ
    
     ໰୊΋ൃੜͤͣʹฏ࿨ʹա͝͠·ͨ͠ - ͜ΕΒͷରࡦͷ͓͔͛Ͱɺ೥຤೥࢝ͷ1000ສاը΋ฏ࿨ʹա͝͠·ͨ͠ 
    ಺෦తʹ΋৭ʑͱݟ௚͕͠ਤΕ͍͍ͯػձʹ
     $%/Խ΍ඞཁͷͳ͍"1*࡟ݮͰύϑΥʔϚϯε΋վળ
23. <hiring/> એ఻ɿAbemaTVͰ͸Ұॹʹಇ͘ਓΛืू͓ͯ͠Γ·͢ ҎԼͷΑ͏ͳਓʹ޲͍͍ͯΔ৬৔Ͱ͢
    ɾΰπ͍41"Λ࡞Γ͍ͨਓ
    ɾ41"
    
    443ͷଟॏߏ੒ʹ೩͑Δਓ
    ɾ਺ඦສϢʔβʔͷ࢖͏ಈըΫϥΠΞϯτΛ࡞Γ͍ͨਓ
    ɾΫϥΠΞϯτ͚ͩ͡Όͳ͘/PEFKT΋ॻ͖͍ͨਓ
24. ͋Γ͕ͱ͏͍͟͝·ͨ͠ 2018/03/09 Frontrend Vol.11 - 2017೥౓ϑϩϯτΤϯυେ൓লձ @ktknest AbemaTV #ϗϯωςϨϏ ͷຊԻ