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

Wantedly のフロントエンド領域の取り組みと課題

Wantedly のフロントエンド領域の取り組みと課題

2024/05/24 (金) にウォンテッドリー社で開催された "Wantedly Tech Night #1" で話した内容になります。
ウォンテッドリーのフロントエンド領域の直近数年間の改善の取り組みと、これから目指したいところ、課題などを話しています。

Avatar for Tsuyoshi HARA

Tsuyoshi HARA

June 11, 2024
Tweet

More Decks by Tsuyoshi HARA

Other Decks in Technology

Transcript

  1. ©2024 Wantedly, Inc. ݪ߶࢜ 5TVZPTIJ)BSB !DIMPF w 8BOUFEMZ *OD w

    'SPOUFOE$IBQUFS-FBE w ࠷ۙͷझຯɾ޷͖ͳ΋ͷ w #"#:.&5"- w ࢄาμΠΤοτ ࣗݾ঺հ
  2. ©2024 Wantedly, Inc. v2 ͷ css module → styled-components Ҡߦ

    10೥ؒͰͰ͖ͨ஍૚ͷղফ 2020೥ʙ2021೥ʹ͔͚ͯߦΘΕͨϑϩϯτΤϯυ࡮৽ͷ ϓϩδΣΫτͷҰ؏Ͱɺv2Ͱ΋styled-components͕ ࢖ΘΕΔΑ͏ʹͳΓ·ͨ͠ɻ ͜Ε·Ͱͷվળͷྺ࢙
  3. ©2024 Wantedly, Inc. v2 ͷ JavaScript → TypeScript v2, v3

    ͸ಉ͡ϨϙδτϦ্ʹଘࡏ͍ͯ͠·͕͢ɺͦΕͧ Ε JS, TS Ͱॻ͔Ε͓ͯΓɺ·ͨผʑͷ webpack ͷઃఆ ϑΝΠϧ͕ॻ͔Ε͍ͯ·ͨ͠ɻ ͦΕΒΛ౷߹Ͱ͖ͨ͜ͱʹΑΓɺv2 ͱ v3 ͷڥք͕͍͋ ·͍ʹͳΓͦΕ΄Ͳҙࣝ͢Δ͜ͱ͕গͳ͘ͳΓ·ͨ͠ɻ 10೥ؒͰͰ͖ͨ஍૚ͷղফ ͜Ε·Ͱͷվળͷྺ࢙
  4. ©2024 Wantedly, Inc. v1 ͷ CoffeeScript ͷ JS Խ Developer

    eXperience (DX) squad ͷऔΓ૊ΈʹΑΓɺ v1 Ͱ࢖༻͞Ε͍ͯͨ CoffeeScript ͕ JavaScript ΁ͱม ׵͞Ε·ͨ͠ɻ ຊདྷ͸ TypeScript Ҡߦ·ͰͰ͖Δͱྑ͍ͷͰ͕͢ɺݹ͍ ػೳͰͲ͜·Ͱ΍Δ͔ͱ͍͏؍఺Ͱߟ͑ΔͱҰ୴͜͜· ͰͰ΋͍͍͔ͳͱߟ͍͑ͯ·͢ɻ 10೥ؒͰͰ͖ͨ஍૚ͷղফ ͜Ε·Ͱͷվળͷྺ࢙
  5. ©2024 Wantedly, Inc. σβΠϯγεςϜͷ੔උ Design System Guild ʹΑΔվળ React ࣮૷Λ੔͑Δ͚ͩͰ͸ͳ͘ࠓճͷࢥ૝΍ఆٛͷ

    Ϩϕϧ͔ΒվળͰ͖ΔΑ͏ʹؔ܎͢ΔΤϯδχΞͱ σβΠφʔΛूΊͨ૊৫Λ্ཱͪ͛·ͨ͠ɻ
  6. ©2024 Wantedly, Inc. R&D αʔϏεՁ஋޲্ʹͭͳ͕Δٕज़తͳνϟϨϯδΛ ਪਐ͍ͨ͠ • ΑΓྑ͍ UX ͷͨΊʹ

    Island Architecture ͷϑϨʔϜϫʔΫݕূͨ͠Γ • ΑΓྑ͍ DX ͷͨΊʹ ESbuild ͱ͔ SWC ͱ͔ vite ͱ͔࢖ͬͨϏϧυߴ଎Λߟ͑ͨΓ • Edge Compute Λ࢖ͬͨػೳͷՄೳੑΛ୳ͬͨΓ
  7. ©2024 Wantedly, Inc. • ௚ۙ਺೥ͷ Frontend Chapter ͷऔΓ૊Έ • ࠓޙղܾ͍͖͍ͯͨ͠՝୊

    ࿩ͨ͜͠ͱ 1. 10೥ؒͰͰ͖ͨ஍૚ͷղফ 2. σβΠϯγεςϜͷ React ࣮૷ͷ੔උ 3. R&D