この記事は食べログアドベントカレンダー2020の2日目の記事です。 こんにちは。食べログFE(フロントエンド)チームの金野です。 以前の記事でもご紹介しました通り、現在食べログは、jQuery+Railsだったフロントエンド環境をReact/TypeScriptに置き換えるリプレースを進めています。 CSSもSassからCSS Modulesを経てstyled-componentsに移行中です。 今回は、「どうしてその技術を選んだか」という技術選定の経緯や、どのような規約で運用しているかをご紹介します! なぜリプレースを始めたのかまず、CSSの技術選定について触れる前に、リプレースの目的について話さなくてはいけません。 食べログは今年で開設から15年となるサービスです。システムも組織も巨大で、且つ複雑な機能が多くあります。 特にフロントエンドは場当たり的な実装も多く、技術的負債が開発時のボ
![SassからCSS Modules、そしてstyled-componentsに乗り換えた話|食べログ フロントエンドエンジニアブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/78ede91a523cf1fcdf8f6482b684c54a5993ffcf/height=288;version=1;width=512/https%3A%2F%2Fassets.st-note.com%2Fproduction%2Fuploads%2Fimages%2F39532789%2Frectangle_large_type_2_b870ef5a1692b90f013332493aaa481e.png%3Ffit%3Dbounds%26quality%3D85%26width%3D1280)