TailwindCSS 2

TailwindCss 3.0소개

TailwindCSS 3.0이 얼마전에 Release되었는데 3.0에서 새로 추가된 기능들을 소개합니다. -JIT(Just-in-time) 기존에는 따로 Mode설정을 해야 사용할 수 있었던 JIT가 이제는 따로 설정하지 않아도 all time사용할 수 있게 되었습니다. -기본 Color Pallete 종류 추가 아래의 Pallete가 2.@ 버전이고 위가 3.@버전입니다. 위의 Pallete외에도 2가지의 Gray theme Pallete가 추가되었습니다. -box-shadow에서 color 선택 가능 기존에는 Shadow 색을 변경하는 명령어가 없었지만 이제는 shadow-blue-500/50와 같이 색을 지정할 수 있습니다. -scroll-snap api가 추가되었습니다. Keen-slider라이브..

frontend 2023.01.14

왜 Tailwind css를 사용해야할까?

Tailwind CSS는 부트스트랩과 비슷한 역할을 한다고 말할수도 있지만 좀 자세히 알아보면 부트스트랩의 상위호환격이라도도 말할 수 있는 프레임워크이다. 그동안 tailwind외에도 styled component, sass를 다 써보았지만 왜 최종적으로 tailwind를 사용하게 되었는지에 대해 이 글에서 소개하려 한다. tailwind의 가장 큰 장점은 사용이 편리하다는 점이다. 예를들어 16px의 padding을 주고 싶을 때 기존에는 클래스를 선언한 뒤 해당 클래스명을 불러와서 사용하는식으로 css를 사용했다면 tailwind는 class부분에 p-4와 같이 입력하면 tailwind프레임워크가 이를 확인하고 해당 부분에 알아서 16px의 padding을 적용시켜준다. tailwind를 처음 사용하..

frontend 2023.01.14