React Tailwind 조건부 클래스 정리: className이 길어질 때 나누는 기준
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 조건부 이 길어지는 이유와 정리 기준을 다룹니다. 짧은 조건은 JSX 안에서 처리하고, 반복되는 조합은 객체로 분리하며, 버튼 컴포넌트가 커졌을 때는 props 구조, 유틸 함수, variant…
더 읽기Tailwind CSS
Tailwind CSS의 기본 개념, 유틸리티 클래스, 반응형 디자인, 레이아웃 구성, 실무 적용 방법을 정리한 카테고리입니다. CSS를 더 빠르고 일관성 있게 작성하는 방법을 다룹니다.
React Tailwind 동적 클래스 해결: 조건부 스타일이 적용되지 않는 이유
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 처럼 조립한 클래스명이 왜 적용되지 않는지 정리합니다. Tailwind CSS v4 기준으로 Tailwind는 JavaScript 실행 결과가 아니라 소스 파일 안의 완성된 클래스 문자열을 기준…
더 읽기
React Tailwind className 정리 기준: 클래스가 길어질 때 가독성 높이기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 className이 길어지는 문제를 JSX 가독성 관점에서 정리합니다. 긴 클래스 자체를 없애는 것보다, 반복되는 조합을 어디까지 상수로 빼고 언제 컴포넌트로 분리할지 판단하는 기준에 초점을 맞…
더 읽기