Pro

Installation

PreviousNext

Set up your project for the shadcn CLI and install Jolocky items in Next.js, Vite, Astro, a headless WordPress front end, or by hand.

Jolocky items are React components that you install with the shadcn CLI. They do not import any Next.js APIs, so they also work in other React setups such as Vite and Astro. Choose your framework below to get started.

Choose Your Framework

Next.js (App Router) is the primary target. There are also guides for Vite and Astro, a page on using Jolocky with WordPress, and a manual (copy and paste) option.

Next.js

Next.js

Vite

Vite

Astro

Astro

WordPress

WordPress

React

Manual

Dependencies

  • React: Every item is a React component. Most items import nothing besides React and React DOM.
  • Item-specific packages: If an item imports an npm package, it is listed in the item's registry dependencies and the shadcn CLI installs it. Sonar Terrain, for example, needs three.
  • shadcn CLI: Installs items and reads your components.json, which npx shadcn@latest init creates. The init command checks that your project has Tailwind CSS and an import alias such as @/*.
  • Styles: Each footer ships its own scoped CSS, so it does not need Tailwind classes or theme tokens to render correctly. See Theming.