Laravel
Laravel
Laravel 프로젝트에 Inertia와 React를 조합해서 shadcn/ui를 설치하는 방법을 알려드릴게요. 전체 과정은 명령어 몇 개로 끝나서 금방 시작할 수 있어요.
출처: 문서
본문
프로젝트 만들기
먼저 Laravel 설치 프로그램인 laravel new my-app을 이용해 Inertia와 React가 포함된 새 Laravel 프로젝트를 만들어요.
laravel new my-app --typescript --breeze --stack=react --git --no-interaction
CLI 실행
shadcn init 명령어를 실행해 프로젝트를 설정해요.
npx shadcn@latest init
components.json 구성
components.json을 구성하기 위해 몇 가지 질문을 받게 돼요.
Which style would you like to use?
Which color would you like to use as base color?
Do you want to use CSS variables for colors? › yes
끝!
이제 프로젝트에 컴포넌트를 추가하면 돼요.
npx shadcn@latest add button
위 명령어가 프로젝트에 Button 컴포넌트를 추가해 줘요. 그런 다음 이렇게 import 하면 됩니다.
import { Button } from "@/Components/ui/button"
export default function Home() {
return (
<div>
<Button>Click me</Button>
</div>
)
}