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

フロントエンドリアーキテクトの話

 フロントエンドリアーキテクトの話

ZOZO Tech Meetup で話したフロントエンドリアーキテクトの話です。

Yosuke Furukawa

June 08, 2023
Tweet

More Decks by Yosuke Furukawa

Other Decks in Programming

Transcript

  1. ϑϩϯτΤϯυϦΞʔΩςΫτ 2023 • ٕज़ސ໰Λ਺͍ࣾͯ͠·͢ • ٕज़ސ໰ͷதͰҰ൪FAQͳͷ͕ • ʮxxxͰ࡞ͬͨ΋ͷΛϦΞʔΩςΫτ͍ͨ͠ͷͰ͕͢ʯͱ͍͏ ໰͍߹ΘͤͰ͢ •

    ࠓճ͸ͦ΋ͦ΋ϦΞʔΩςΫτͱ͸Ͳ͏͍͏΋ͷͳͷ͔ • ϦΞʔΩςΫτ͕͏·͍͘͘ͷͱ͏·͍͔͘ͳ͍ͷ͸Կ͕ҧ ͏ͷ͔ʹ͍ͭͯ࿩͠·͢
  2. ૊৫ͷٕज़ܧঝͷ࿩ • ࣜ೥ભٶͱ͍͏ߟ͑ํ • ࣜ೥ʢఆظతʹʣભٶʢ৽఼͍ࣾ͠Λ଄ΓɺޚਆମΛભ͢ʣ • ۩ମతʹ͸20೥ʹҰ౓ඞͣߦ͏ɻભٶʹΑΔࣄۀඅ͸2013೥Ͱ໿550ԯԁ • ࣜ೥ભٶࣗମ͸ਖ਼ٶͷҠಈʢϝΠϯϞδϡʔϧͷҠ͠ସ͑ʣ͕ऴΘͬͨ ޙɺผٶͷҠಈʢαϒϞδϡʔϧͷೖΕସ͑ʣ͕͋Δɻ

    • ͜ͷؒɺ2೥ؒ͸໿160໊ͷٕೳऀͷޏ༻͕ଓ͘ɻผٶͷભٶऴྃޙɺएख ΍ٕೳ༏लऀ30໊΄ͲΛਆٶͷৗۈ৬һͱͯ͠࢒͢ɻ • ࠃ౔ަ௨লͷίϥϜʮࣜ೥ભٶʹݟΔٕज़ܧঝͱٕज़ऀ֬อ https://www.mlit.go.jp/hakusyo/mlit/h25/hakusho/h26/html/ n1233c20.htmlʯΑΓ
  3. ϦΞʔΩςΫτΞϯνύλʔϯ ू • पลͷٕज़͹͔ͬΓ΍ͬͪΌ͏ύλʔϯ • eslint, prettier, pnpm, yarn, vite,

    vitest, ͜͏͍͏πʔ ϧΛͲ͏͢Δ͔͹͔Γ೰ΜͰલʹਐΜͰͳ͍ύλʔϯ • ඪ४ͷղ๏Έ͍ͨͳͷΛ௥͍ٻΊ͗ͯ͢Δ • ਖ਼ղͳΜͯແ͍ɺ೰·ͣʹਐΊͨΒͦΕ͕ਖ਼ղ • ޙ͔ΒͳΜͱͰ΋ͳͬͨΓ͢Δ
  4. ϦΞʔΩςΫτΞϯνύλʔϯ ू • ·ͩݟ͵ແݶͷকདྷʹࢥ͍Λ஘ͤͯ͠·͏ύλʔϯ • ͜Μͳ͜ͱ͍͍ͳ • Ͱ͖ͨΒ͍͍ͳ • ͋Μͳػೳ͜Μͳίϯϙʔωϯτ͍ͬͺ͍͋Δ͚Ͳ

    • ਐ·ͳ͍ʂʂʂ • શ෦Λ·Δͬͱ࠷ॳ͔ΒΑ͘͢Δ͜ͱ͸Ͱ͖ͳ͍ • ͪΐͬͱͣͭͪΐͬͱͣͭܧଓతʹΑ͘͢Δ͜ͱ͔͠Ͱ͖ͳ͍
  5. ϦΞʔΩςΫτΞϯνύλʔϯ ू • طଘػೳͷΤϯϋϯεΛετοϓͤͯ͞ϦΞʔΩςΫτ༏ઌͪ͠Ό͏ύλʔ ϯ • γϯϓϧʹαʔϏεͷػೳ௥Ճ͕ࢭ·Δ • جຊ͸ࣹܸͭͭ͠લਐ •

    ελʔτΞοϓͱ͔ͩͱ྆ํ΍Βͳ͍ͱ͍͚ͳ͍ͷ͕ਏ͍ͱ͜Ζ • ܦӦ൑அͰϦΞʔΩςΫτ༏ઌ͢ΔͳΒྑ͍͕ɺΤϯϋϯε͠ͳ͕Β΍ Δͷ͕Ұൠత • ػೳ΍ը໘͕෼ׂ͞ΕͯͨΒ͚ͩ͜͜ػೳ௥Ճ͠ͳ͍Ͱ΄͍͠ͱ͍͏ ͷ͸ݴ͍΍͍͢