공식 문서

• https://ui.shadcn.com/

만약 버튼을 사용하고 싶다?!

npx shadcn-ui@latest add button

• 위의 명령어를 실행하면 components 하위 폴더에 UI가 생성된다.

<aside> 💡 tailwind로 만들어진 버튼 컴포넌트가 만들어진다…

</aside>

• 예시 코드

import Image from 'next/image';

import { Button } from '@/components/ui/button';

export default function Home() {
  return (
    <>
      <p>Hello admin Dashboard</p>
      <Button size='icon' variant='destructive'>
        버튼!
      </Button>
    </>
  );
}

• 장점
  • npm에 설치되지 않고,
  • 자유로운 커스터마이징
  • tailwind로 되어져 있는 UI