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

2020年代、使う技術はどう選ぶ?

993ef638264def4334358f986fb4a91d?s=47 uhyo
March 25, 2021

 2020年代、使う技術はどう選ぶ?

Front-End Study #5 の発表資料です。
https://forkwell.connpass.com/event/205227/

フィードバックはこちら:
https://koibu.me/events/14/talks/wQQs0pbvMZHcnZ8TawAi

993ef638264def4334358f986fb4a91d?s=128

uhyo

March 25, 2021
Tweet

Transcript

  1. ೥୅ɺ ࢖͏ٕज़͸Ͳ͏બͿʁ 'SPOU&OE4UVEZ -*/&גࣜձࣾ ϑϩϯτΤϯυΤϯδχΞ VIZP

  2. "CPVU4QFBLFS uhyo –-*/&ͷϑϩϯτΤϯυΤϯδχΞ –5ZQF4DSJQUͱ3FBDU͕ओͳ෢ث –ొஃ͢Δͱ͍ͭ΋ܕ҆શੑͷ࿩Λ͢Δ – ࠓճ͸͋·Γ͠·ͤΜ

  3. Q. 2020年代のフロントエンド͸Ͳ͏ͳΔʁ

  4. Q. 2020年代のフロントエンド͸Ͳ͏ͳΔʁ A. Θ͔Γ·ͤΜ

  5. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠

  6. ະདྷͷ͜ͱΛ஌Δͷ͸೉͍͠ ೥લɺࠓͲ͏ͳ͍ͬͯΔ͔૝૾Ͱ͖·͔ͨ͠ʁ ೥ͷࣗ෼͸૝૾Ͱ͖ͳ͔ͬͨͷͰ K2VFSZͱ$PGGFF4DSJQUͰ41"Λ࡞ͬͯ·ͨ͠ɻ ͳΜͱࠓ΋ಈ͍ͯΔʂʢએ఻ʣ ݄Լਓ࿛ IUUQTKJOSPVVIZPIZPOFU

  7. 5IJT5BML –ະདྷͷ͜ͱ͕෼͔Βͳ͍தͰͲ͏ٕज़બఆ͢Δ͔ –ະདྷͷ͜ͱΛ༧ଌ͢ΔͨΊʹ͸Ͳ͏͢Δ͔

  8. ໰୊ղܾͱٕज़બఆ

  9. ະདྷΛ஌Δͱ͸ –ʮະདྷΛ஌Δʯ –কདྷతʹϑϩϯτΤϯυྖҬͷٕज़ελοΫ ʹൃੜ͢ΔมԽΛ஌Δ –কདྷྲྀߦΔٕज़ɾ͜Ε͔ΒֶͿ΂͖ٕज़Λ஌Δ –஌͚ࣝͩͰ͸Ͳ͏ʹ΋ͳΒͳ͍😩 –೥୅ʹى͖ͨมԽɾྲྀߦٕͬͨज़͕ࢀߟʹͳΔ͔΋ʁ

  10. ೥୅ͷߦ·ͱΊ –એݴత6*͕ग़͖͕ͯͯࠢ਒͑ͨ –5ZQF4DSJQU͕ීٴ –8FCඪ४ͷਐԽ͕Ճ଎

  11. Q. ৽͍ٕ͠ज़͸ͳͥੜ·ΕΔͷ͔ʁ

  12. Q. ৽͍ٕ͠ज़͸ͳͥੜ·ΕΔͷ͔ʁ A. ৽͍͠໰୊Λղܾ͢ΔͨΊ – ϥΠϒϥϦ΍ϑϨʔϜϫʔΫ͸໰୊ղܾͷखஈͰ͋Δ – ৽͍͠໰୊Λղܾ͢ΔͨΊʹ͸৽͍ٕ͠ज़͕ඞཁͰ͋Δ

  13. େ৽ٕज़ͷ෼ੳ ϑϩϯτΤϯυ։ൃͷେن໛Խ એݴత6* ੩తܕγεςϜ ໋ྩతͳ%0.ૢ࡞͕ͭΒ͍ ιʔείʔυͷಡղɾߋ৽ίετ ͕େ͖ͯͭ͘Β͍ ໰୊ ղܾࡦ

  14. େ৽ٕज़ͷ෼ੳ એݴత6* ܾࡦ

  15. େ৽ٕज़ͷ෼ੳ એݴత6* ܾࡦ ͍ͭ͜Β͸ ͷҧ͍ ઃܭ

  16. Α͘ฉ͔ΕΔ࣭໰ Q. Ͳ͏ͯ͠3FBDUΛબΜͩͷʁ

  17. Α͘ฉ͔ΕΔ࣭໰ Q. Ͳ͏ͯ͠3FBDUΛબΜͩͷʁ A. ޷͖͔ͩΒ

  18. ͲͷϥΠϒϥϦΛબͿʁ એݴత6* ܾࡦ ͜ͷ ͕޷͖ ઃܭ

  19. એݴత6* ͍ͭ͜Β͸ ͕ҧ͏͚ͩɻ ͱ ͸͍͍ͩͨಉ͡ɻ ͲͷϥΠϒϥϦΛબͿʁ ܾࡦ ઃܭ ໰୊ ղܾࡦ

    ͷྑ͠ѱ͠΋͋Δ͕ɺ ޷ΈͰબΜͰ΋ΘΓͱྑ͍ɻ ઃܭ
  20. ݁ہະདྷΛ஌Δʹ͸Ͳ͏ͨ͠Β͍͍͔ ະདྷΛ஌Δʹ͸৽͍͠ Λ஌Ε͹͍͍ʂ Ή͠Ζ Λࣗ෼Ͱ࡞Ε͹ະདྷΛ࡞ΕΔ͔΋ʜʜ ղܾࡦ ໰୊ ղܾࡦ ໰୊

  21. ૝ఆ͞ΕΔٙ໰ Q. Ͳ͏ͨ͠Β৽͍͠ Λ஌Δ͜ͱ͕Ͱ͖Δʁ ղܾࡦ ໰୊

  22. ૝ఆ͞ΕΔٙ໰ Q. Ͳ͏ͨ͠Β৽͍͠ Λ஌Δ͜ͱ͕Ͱ͖Δʁ A. ࢥ͍ͭ͘ ղܾࡦ ໰୊

  23. ϥΠϒϥϦͷਐԽͱ໰୊ղܾ ύϥμΠϜΛม͑ΔϨϕϧͷ ͸ͱͯ΋رɻ ೥Ͱͭͱ͔ɻ ͔͠͠ϑϩϯτΤϯυͷਐԽ͸଎͍ͱݴΘΕΔɻͳ͔ͥʁ ΑΓখ͞ͳ໰୊ղܾαΠΫϧΛճ͍ͯ͠Δ͔Β ղܾࡦ

  24. 3FBDUͷྫ ղܾࡦ ໰୊ ໋ྩత%0.ૢ࡞͸ εέʔϧ͢Δઃܭ͕ࠔ೉ એݴత6*ɾԾ૝%0. ղܾࡦ ໰୊ ίϯϙʔωϯτͷઃܭ͕ ͭΒ͍ʢεςʔτϑϧʹ

    ͳΓ͕ͪʣ 3FBDU)PPLT ղܾࡦ ໰୊ ඇಉظॲཧͷઃܭ͕·ͩͭΒ͍ ʢ໋ྩతɾεςʔτϑϧʹͳΓ͕ͪʣ 69ͱͷཱ྆΋೉͍͠ 3FBDU$PODVSSFOU.PEF ʢະϦϦʔεʣ ղܾࡦ ໰୊ όϯυϧαΠζ࡟ݮͷͨΊʹܭࢉΛ αʔόʔଆʹҠ͢ͱΞϓϦͷઃܭ͕ ΍΍͘͜͠ͳΔ 3FBDU4FSWFS$PNQPOFOUT ʢະϦϦʔεʣ
  25. 3FBDUͷਪ͠ϙΠϯτ ͞·͟·ͳ Λग़ͯ͘͠Δ͕ɺҰ؏ͨ͠໨తҙࣝΛ ͍࣋ͬͯΔɻ ࢦ਑΋Ұ؏͍ͯ͠Δɻ ղܾࡦ ໰୊ IUUQTSFBDUKTPSHEPDTDPODVSSFOUNPEFJOUSPIUNM IUUQTHJUIVCDPNKPTFQITBWPOBSGDTCMPCTFSWFSDPNQPOFOUTUFYUTFSWFSDPNQPOFOUTNE ઃܭ

  26. 3FBDU͸·͍͚ͩΔ Ұ؏ͨ͠ ͔Β܁Γग़͞ΕΔਐԽΛ͋ͱͭ΋ ࢒͍ͯ͠Δʂ ͜ͷઌͷํ޲ੑ͕༧ଌ͠΍͍͢ ͷΞοϓσʔτ͕ظ଴Ͱ͖Δ ʹ௕ظతͳ࠾༻ɾֶशͷର৅ͱͯ͠৴པੑ͕ߴ͍ ʢͰ΋$PODVSSFOU.PEFൃද͔Β೥Ҏ্ܦͬͯΔͦ͠ΖͦΖϦϦʔεͯ͠΄͍͠ʣ ղܾࡦ ໰୊

    ઃܭ ղܾࡦ ໰୊
  27. ೦ͷͨΊ͝஫ҙ 3FBDUҎ֎ͷϥΠϒϥϦΛඇ೉͢Δҙਤ͸͋Γ·ͤΜɻ ࣗ෼ͷ޷͖ͳϥΠϒϥϦͷ໨తҙࣝΛߟ࡯ͯ͠Έ·͠ΐ͏ɻ 🤫

  28. छྨͷٕज़બఆ ୹ظతͳٕज़બఆʢ͙͢ʹݱ৔Ͱ࢖͏ͱ͔ʣ ͸ࠓͷϕΫτϓϥΫςΟεͰ΋͍͍ɻ ࠓͷͨΊͷ Ͱબ΅͏ –ॻ͖΍͍͢ɾܕ͕͍͍ FUD த௕ظతͳٕज़બఆʢ਺೥ޙΛݟਾ͑ͨʣ ΑΓ৽͍͠ Λબ΅͏

    ղܾࡦ ໰୊ ઃܭ ղܾࡦ ໰୊
  29. ୺తʹ·ͱΊΔͱ த௕ظతͳٕज़બ୒͸৽͍ٕ͠ज़Λ࠾༻͠Ζʂ ͳͥͳΒ৽͍ٕ͠ज़͸৽͍͠ Λղܾ͢Δ͔Β Λఏى͠ଓ͚ΔϥΠϒϥϦ͸৴པͰ͖Δ ໰୊ ໰୊

  30. ཧ૝ͱݱ࣮ Q. Ͱ΋৽͍ٕ͠ज़͸ރΕͯͳ͍͠ʜʜ৘ใ͕ͳ͍͠ʜʜ

  31. ཧ૝ͱݱ࣮ Q. Ͱ΋৽͍ٕ͠ज़͸ރΕͯͳ͍͠ʜʜ৘ใ͕ͳ͍͠ʜʜ A. ͦΕ͸ݱ࣮ͷ࿩Ͱ͢Ͷɻ – ඞཁͳ৘ใΛࣗΒௐ΂ͯಘΒΕΔͷ͕ཧ૝తͰ͢ΑͶʁ – ׬ᘳͳղܾࡦΛࣗΒ࡞Δͷ͕ཧ૝తͰ͢ΑͶʁ –

    ͱ͍͏͔ࣗࣾͰॻ͍ͨΫϩʔζυͳιʔεΑΓ͸ރΕͯ·͢ΑͶʁ
  32. ཧ૝ͱݱ࣮  ແ  ཧ૝ ࣌ؒతཁҼ ਓతཁҼ FUD ݱ࣮తબ୒ •

    ৭ʑͳཁҼʹΑΓཧ૝͔Βԕ͕͞Δͷ͸ ࢓ํ͕ͳ͍ɻ • ͏·͍མͱ͠ॴΛݟ͚ͭΔͷ΋·ٕͨज़ྗɻ • ͔͠͠ཧ૝͸ཧ૝ͱͯ͠ଘࡏ͢Δɻ
  33. ༨ஊ Q. ͳͥཧ૝ΛޠΔͷ͔ʁ A1. 理想͸جຊɺ現実͸Ԡ༻ͳͷͰ A2. Έͳ͞Μͷࢹ໺Λ޿͛ΔͨΊ

  34. ༨ஊ5ZQF4DSJQUͷྫ  ແ BOZύϥμΠε  ཧ૝ TUSJDUUSVF OP*NQMJDJU"OZUSVF ˡ͜ͷ΁Μ͕མͱ͠ॴ͔ͳʁ ͘Β͍

  35.  ແ BOZύϥμΠε  ཧ૝ TUSJDUUSVF OP*NQMJDJU"OZUSVF ˡ͜͜Ͱ͚͢Ͳʜʜ  ۃ๺

    BT΋ݪଇ࢖༻ېࢭ ࢖༻͢Δ৔߹͸આ໌ίϝϯτඞਢ
  36. 8FCඪ४Λ௥͑ʂ

  37. ೥୅ͷߦ·ͱΊ –એݴత6*͕ग़͖͕ͯͯࠢ਒͑ͨ –5ZQF4DSJQU͕ීٴ –8FCඪ४ͷਐԽ͕Ճ଎

  38. Q. ͳͥ8FCඪ४Λ௥͏΂͖ͳͷ͔ʁ

  39. Q. ͳͥ8FCඪ४Λ௥͏΂͖ͳͷ͔ʁ A. 8FCඪ४͸ڀۃͷ ͔ͩΒ – ϥΠϒϥϦϨϕϧͰղܾͰ͖ͳ͍͜ͱΛϒϥ΢β͕ղܾͯ͘͠ΕΔ – ϥΠϒϥϦ΋݁ہ8FCඪ४ͷ্ʹ৐͍ͬͯΔ ղܾࡦ

  40. 8FCඪ४͸ະདྷ΁ͷಓඪ 8FCඪ४͸ ʹର͢Δࠜຊతͳ Λ༩͑Δ͕ɺ ϩʔϨϕϧͳ"1*Ͱ͋ΓPQJOJPOBUFEͳ ͸൐Θͳ͍ɻ ֤ʑͷ Λ࣋ͬͨϥΠϒϥϦ͕࡞ΒΕΔɻ ͱ͍͏͜ͱ͸͋͋͋͋͋͋͋͋ ৽͍͠8FCඪ४Λ஌Ε͹ະདྷͷ؀ڥ͕༧ଌͰ͖Δʂ

    ղܾࡦ ໰୊ ઃܭ ઃܭ
  41. ྫ$44ͱ4IBEPX%0. ղܾࡦ ໰୊ $44͸άϩʔόϧʹొ࿥͞Εɺ େن໛ʹͳΔͱ؅ཧ͕೉͍͠ ඃΒͳ͍Ϋϥε໊ͷࣗಈੜ੒ ʢϥΠϒϥϦϨϕϧղܾࡦʣ ղܾࡦ 4IBEPX%0. ʢ࢓༷Ϩϕϧղܾࡦʣ

    ઃܭ 8FCQBDLͷ$44.PEVMFT ֤छ$44JO+4ϥΠϒϥϦ ઃܭ 4IBEPX%0.ϕʔεͷ$44JO+4 ϥΠϒϥϦΛ࡞Γ·ͨ͠ʢએ఻ʣ IUUQTHJUIVCDPNVIZPDBTUFMMB ղܾࡦ ໰୊ 4IBEPX%0.͸443Ͱ͖ͳ͍ ʢ4IBEPX%0.಺Λੜ੒͢Δͷʹ+4͕ඞਢʣ %FDMBSBUJWF4IBEPX%0.
  42. ྫ&4.࣌୅ͷϦιʔε഑৴ Q. &4.PEVMFTωΠςΟϒͷ࣌୅ʹͳΔͱɺ ͷΑ͏ͳόϯυϥ͸ෆཁʹͳΔʁ

  43. ྫ&4.࣌୅ͷϦιʔε഑৴ Q. &4.PEVMFTωΠςΟϒͷ࣌୅ʹͳΔͱɺ ͷΑ͏ͳόϯυϥ͸ෆཁʹͳΔʁ A. ͍͍͑ɺόϯυϥ͸·ͩඞཁͰ͢

  44. ྫ&4.࣌୅ͷϦιʔε഑৴ ղܾࡦ ໰୊ &4.PEVMFTͷϞδϡʔϧάϥϑશମΛऔಘ͢Δʹ͸ αʔόʔͱͷؒΛԿԟ෮΋͢Δඞཁ͕͋Δ )5514FSWFS1VTIʢ಴࠳ʣ ղܾࡦ 3FTPVSDF#VOEMFT #VOEMFE3FTPOTFT#BUDIFE1SFGFUDIFT όϯυϥ͸+BWB4DSJQUͰ͸ͳ͘#VOEMFE3FTQPOTFTΛग़ྗ͠ɺ

    ϒϥ΢βɾαʔόʔ΋#VOEMFE3FTQPOTFTΛωΠςΟϒʹཧղ͢Δ ʢએ఻ʣ #VOEMFE3FTQPOTFTΛಡΈॻ͖Ͱ͖Δ$-*ͱ͔Λ࣮૷͠·ͨ͠ IUUQTHJUIVCDPNVIZPSFTPVSDFCVOEMFT 🌐📦 ղܾࡦ ໰୊ +4ͷϑΝΠϧ਺͕ଟ͗ͯ͢ ύϑΥʔϚϯε͕ѱ͍ .PEVMF'SBHNFOUT ʢ4UBHF1SPQPTBMʣ
  45. ·ͱΊ

  46. ٕज़બఆ ໨తʹ߹Θͤͯ෼͚ͯߟ͑Α͏ɻ –͙͢࢖͏ ޷͖ͳɾखʹೃછΉ ΛબͿͷָ͕ɻݱ৔ͷঢ়گʹ߹Θͤͯ࢖ ͑ΔΑ͏ʹམͱ͠ࠐΉ͜ͱ΋ॏཁɻ –௕͘࢖͍͍ͨɾઌΛݟਾ͑ͨεΩϧ޲্ ྑ͍ Λબ΅͏ɻྑ͍ ͸௕͍໨ͰݟΔͱൃల͢Δ͸ͣɻ

    ݟΔ໨Λຏ͍ͯΞʔϦʔΞμϓλʔʹɻ ઃܭ ղܾࡦ ղܾࡦ
  47. ྑ͍ղܾࡦͬͯʁ ࣗ෼Ͱ Λۛຯ͢Δͷ͕ཧ૝ɻʢ೉͍͠ʣ 8FCඪ४Λ௥͏ͷ͕ݎ࣮ɻ ࣍ͷ࣌୅ʹྲྀߦΔϥΠϒϥϦΛ༧૝ͯ͠ΈΑ͏ɻ ղܾࡦ

  48. ·ͱΊ ໰୊ղܾͱ͍͏ࢹ఺Ͱٕज़બఆΛߟ͑ͯΈ·ͨ͠ɻ ཧ૝తͳͷ͸ࣗ෼Ͱ໰୊ɾղܾࡦΛߟ͑Δ͜ͱɻ ط੒ͷϥΠϒϥϦΛ࢖͏ࡍ΋ղܾࡦΛҙࣝ͠Α͏ɻ