Getting Started
Learn how to set up ComponentVault in your project and install your first component.
Getting Started
Learn how to set up ComponentVault in your project and install your first component.
Prerequisites
Before you begin, make sure you have:
Node.js 18+
Required for running the CLI and building your project.
A React project with Tailwind CSS
Next.js, Vite, Remix, or any React framework works.
ShadCN UI initialized
Run npx shadcn@latest init if not already set up.
Installation
Free Components
Install any free component using the shadcn CLI:
npx shadcn@latest add https://registry.example.com/animated-cardThis will:
- Download the component source code
- Install any required dependencies
- Add the component to your
components/uidirectory
Premium Components
Premium components require a license key. After purchasing, configure your CLI:
npx shadcn@latest add https://registry.example.com/data-table-pro \
--token cv_your_license_keyKeep your license key private. Never commit it to version control.
Project Structure
After installation, your project structure will look like this:
my-project/
├── components/
│ └── ui/
│ ├── button.tsx
│ ├── card.tsx
│ └── animated-card.tsx # New component
├── lib/
│ └── utils.ts
└── ...