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

Turborepo Code Generationによる、サイバーエージェントグループのフロン...

did0es
September 08, 2023

Turborepo Code Generationによる、サイバーエージェントグループのフロントエンド開発の効率化

JS/TSのプロジェクトで、ビルドシステムやmonorepoの構築に用いられるTurborepoには、Code Generationという機能が存在します。 この機能を活用した、人為的ミスの防止や開発リソースの削減など、実際にサイバーエージェントグループの開発現場で行われている取り組みについてお話します。

イベントURL:https://uit.connpass.com/event/291443/

did0es

September 08, 2023
Tweet

More Decks by did0es

Other Decks in Technology

Transcript

  1. Shuta Hirai 株式会社サイバーエージェント グループIT推進本部 CyberAgent group Infrastructure Unit(CIU) フロントエンドエンジニア Social Accounts

    ・https://github.com/shuta13 ・https://twitter.com/did0es 週末は代々木公園でフットサルをして、 松屋で朝食を食べるのが僕のスタンダードです
  2. 20

  3. 2

  4. Generators (前提:Next.js App Routerのプロジェクト) ・components : UIコンポーネント ・pages : ページ(Page,

    Layout, Template) ・route-handlers : Route Handlers ・core-domain : 各種ドメイン(Controller, Entity, Presenter)層 ・core-schema : ZodによるSchema
  5. Generators (前提:Next.js App Routerのプロジェクト) ・core-interface : Adapter(ClientとServerとの接続)層のInterface ・hooks-adapter : ↑の実装

    ・hooks-usecase : Usecase層 ・hooks-cache-key-generator : SWRのキャッシュキー ・libs-locale : i18n対応用の辞書
  6. 今後の展望 Codemod Generatorでファイル更新の半自動化 ・Codemodを起動するGeneratorで更新に追従できるように Turborepoに乗っかり続ける vs Code Generator内製 ・当面はTurborepoを使い続けそうだが... ・Remote

    Cachingが求めていることに合うか次第 ・Code Generatorだけ使うなら内製しても良いかも ・Inquirerより速いCLI × Handlebars以外のDSL ・GoかRustで全部書く