Remix Setup with shadcn/ui: Easy Guide to Enhance Your Project! #shadcn #ui
- shadcn/ui를 사용하여 Remix 프로젝트를 쉽게 구성할 수 있다. 🤩
- npx create-dash remix at latest 를 사용하여 Remix 프로젝트를 생성한 후, npx shadcn/ui at latest 를 통해 shadcn/ui를 초기화한다. 🤖
- 'app/tailwind.css' 파일을 구성하여 컴포넌트 스타일 및 'tilde/lib/utils' 의 유틸리티 스타일을 정의한다. ✂️
npm add
명령어로 Tailwind CSS와 Autoprefixer를 개발 의존성으로 추가한다. 🔧
host/css/config.js
파일에서 Tailwind CSS와 PostCSS 플러그인을 설정하고, remix.config.js
파일에서 tailwind: true
및 postcss: true
를 추가한다. ⚙️
- Root 컴포넌트(
app/root.tsx
)에서 tailwind.css
스타일을 import하여 웹 페이지에 적용한다. 🔌