시작하며...지금까지 다양한 CSS 라이브러리를 사용해 보았다. 그중에서 가장 많이 사용해 본 라이브러리는 Tailwind CSS와 Emotion이다. 이 두 라이브러리를 성격이 많이 다른 라이브러리이다. 그래서 각 라이브러리의 특징을 알아보고 비교해 보면 좋을 거 같아 글을 작성하게 되었다. 1. Tailwind CSS🥇 마음속 1위우선 Tailwind CSS가 나에게는 1위이다.Tailwind CSS를 사용한 프로젝트의 회고록을 보았더니 정말 찬양할 정도를 Tailwind CSS를 좋아했다...ㅋㅋㅋㅋ 그래서 해당 라이브러리를 사용하면서 느낀 장점과 단점을 정리해 보았다. Tailwind CSS 장점1. 빠르고 간편한 반응형 디자인Tailwind는 미디어쿼리를 사용하지 않고 sm: md: lg: 이..

☘️Emotion 이란? Emotion CSS 스타일을 JavaScript 코드 안에 작성하는 CSS-in-JS 방식을 사용하여 쉽게 스타일을 관리할 수 있는 라이브러리 자세한 정보를 얻고 싶으면 아래 공식 문서를 참고하면 된다. [Emotion] 공식 문서 Emotion – Introduction (Edit code to see changes) emotion.sh ☘️Emotion 사용법 React를 사용하는 사용자에게 권장되는 라이브러리인 @emotion/react 패키지를 사용할 것이다. 1. 라이브러리 설치 npm i @emotion/react 2. 문자형 css() 함수 Emotion에서 제공하는 css() 함수를 사용하는 방법에는 문자형/객체형이 있다. // 문자형 import { css } ..