「React開発でEmotionを導入したい」 「styled-componentsより使える?」 「TypescriptでEmotionを使いたい」 「Emotion使ってみたけど、なんかCSSが適用されないんだけど...」 上記の悩みにお答えします。 「Emotion」はJavaScriptでCSSを記述するために作られたライブラリで、いわゆるCSS-in-JSのひとつです。 同じCSS-in-JSの中で、「styled-components」というものがあります。 Emotionとstyled-componentsはよく比べられますよね。 Emotionを使うべきなのか、どうやって使えばいいのか悩んでいる方も多いはず。 そこで、この記事ではReactでEmotionを使う方法を解説します。 内容は以下です。 Emotionを使うメリット Emotionの導入 基本的な使い方 応用的な