배경1편에서 Next.js와 tailwindcss 그리고 백엔드는 Nest.js로 이루어진 모노레포로 구성된 프로젝트를 진행했으며, pnpm-workspace.yaml 모노레포의 패키지 별 의존성 문제를 해결했다. 그러나 tailwindcss를 사용하는 과정에서 새로운 문제가 발생했다. 그래서 2편에서는 tailwindcss 관련해서 어떤 문제가 발생했는지, 어떻게 해결했는지를 공유하고자 한다.기술 스택기술 스택은 1편과 동일하다.프론트엔드언어: TypeScript프레임워크: Next.js v16스타일링: Tailwindcss v4패키지 매니저: pnpm백엔드언어: TypeScript프레임워크: Nest.js v11ORM: Typeorm데이터 베이스: PostgreSQL패키지 매니저: pnpm문제 발생t..

배경이번에 풀스택 개발을 진행하면서, Next.js 프론트엔드와 Nest.js 백엔드 애플리케이션을 공동으로 작업하기 위해 모노레포를 구성하였다. 모노레포를 구성하는 것도 처음이라서 혼란스러운 부분이 많았는데, 프론트엔드 애플리케이션 외부에서 tailwind css를 사용할 수 있도록 세팅하는 과정이 많이 힘들었다. 이번 글에서는 Next.js와 tailwindcss로 모노레포를 구성하는 법을 작성하고, 다음 글에서는 그 과정에서 겪은 트러블 슈팅 내용을 공유하고자 한다.기술스택이번 풀스택 프로젝트를 위해 사용한 기술스택은 아래와 같다.프론트엔드언어: TypeScript프레임워크: Next.js v16스타일링: Tailwind css v4패키지 매니저: pnpm백엔드언어: TypeScript프레임워크: ..