많은 고민 끝에 Tailwind를 Main CSS Library로 사용하기로 결정했는데 

그 고민 중에 일부분을 써놓겠음.


1. Tailwind CSS는 이미 업계 세미 표준이다.

내가 주로 쓰는 PrimeVue, NuxtUI 는 모두 Tailwind와 잘 통합되어 있음.


2. 퍼블리싱 의뢰가 쉽다.

진짜 퍼블리싱은 사람마다 자기 꼴리는데로 하는 경우가 많고, 경력에 따라 수준도 생각보다 천차만별임.
심지어 디자인 툴에서 걍 Export 해서 내보내는 사악한 놈도 있었음. 

아예 Tailwind로 해달라고 못박아버리면, 정해진 방식대로만 퍼블리싱이 되기에 퀄리티가 균등해짐.



3. 오염이 적고 구조를 고치기 쉬워서 덜 피곤하다.

하다보면 > Selector 같은걸 많이 쓴 경우, HTML 스트럭쳐를 변경하다보면 스타일이 다 깨져버려서 

그거 복구하느라 시간을 쏟게 되는 경우가 많았다.


가끔 전역으로 클래스를 정하는 경우.
하나를 바꾸면 다른 부분에 대한 사이드 이펙트가 생겨서 개피곤 해지는데.
많이 퍼블리싱 해본 애들은 알잘딱깔쎈 하게 하지만, 퍼블리싱하는 애들은 대부분 저경력이라 개피곤하다.

Tailwind는 블럭 단위로 어느정도 복붙해도 오염 문제가 적어서 스타일이 대체로 그대로 유지되기에 재사용성이 더 좋았다.



4. 라이브 에디팅

원래 크롬 개발자 도구 띄워놓고 바로 CSS를 수기로 적어서 괜찮아보이면 다시 본 코드에 반영하고 그랬다.

그런데 생각해보니 요즘에는 Hot Module Repleacement가 워낙 잘 되어있어서,

걍 본 코드에 수정 하면 바로바로 실시간으로 적용된다.. 그래서 귀찮은 일을 두번 안하게 되는 장점이 있었다.

요즘엔 IDE에 통합된 편이라 자동완성도 잘 됨.



5. 테마링이 편하다.

다크모드 지원이나, 테마, 모바일 사이즈로 만들기 수월함.
일 시키면 제일 깝깝한게 다크모드나 테마를 제대로 다룰줄 모르는 친구들이 많다는 점인데.

쉽게 딸깍딸깍 전환해서 보여줄 수 있어서 이거 보고 하라고 하면 잘하는 편임.



6. AI한테 시켜먹기도 편하다.

국소적인 디자인 반영이기에 부분적으로 AI한테 시켜먹기도 굉장히 좋다.
특히 요즘 멀티모달이라서 이미지 던져주면 알아서 해주는데 Tailwind가 제일 깔끔히 반영된다.



7. 에코시스템
수많은 디자이너들이 최신 트랜드에 맞게 센스있게 잘 디자인해서 템플릿을 제공해준다.
이걸 그냥 돈주고 사면 됨.



8. 불호와의 갈등.

역시나 가장 큰 불호라면, HTML 스트럭쳐를 깔끔히 하고 싶은데 

class에 다 때려박혀 있다보니. 꽤 지저분해지고 스트럭쳐가 가려져서 명확히 보이지않는다는 큰 단점이 있다.

이게 가장 큰 불호의 요소인 것이고.


그런데 여기선 3가지의 오해 포인트가 있었다.

1) 크롬 에디터에서 바로 Class를 추가해서 스타일을 보는 방식으로 작업해야하는게 아니라, 본 코드에서 바로 클래스를 추가해서 봐야 장점이 느껴진다는 점. 

2) Vue, React 처럼 Component Base로 만드는 경우 @apply로 기존 css처럼 단순화시켜 만들 수 있다는 점.

3) 수많은 클래스를 다 기억 못하니 Config Viewer를 제공한다는 점임.



NuxtUI를 쓰는데, 여기선 아예 설정한 컬러값이나 설정에 대해
현재 테마에 대한 Viewer를 제공해줘서 저걸 보고 고르면 되기에 꼭 다 기억할 필요가 없었다.




결론은

나만 여기에 적응하면 여기에 생태계를 잘 활용할 수 있다는 더 큰 이득이 있어서 

여기에 적응하기로 함.