Create a current project

The shadcn CLI changes often. Do not copy init commands from an old blog post. Open the current installation page and pick a supported template, or initialize an existing Next.js or Vite project.

For this course we use Next.js so the final interface can connect to the preceding Next.js course. The CLI can scaffold a template directly. The init command configures an existing project. Run commands from the application root. Read every prompt. Do not accept a base, style, icons, and color you did not intend.

The current CLI lets you select a supported primitive base. That decision changes generated imports and composition APIs. Record it with your style and color choices. Do not combine a recent Base UI project with component code copied from an old Radix tutorial without translating the behavior.

# new Next.js template
npx shadcn@latest init -t next

# or inside an existing compatible project
npx shadcn@latest init

After init finishes, check that the CLI wrote the files you expect:

ls components.json src/app/globals.css

You should see components.json at the project root and updated global CSS. If either path is missing, the init did not complete cleanly.

Before initialization, commit or snapshot the clean application. Run the command, then review components.json, global CSS, package changes, aliases, and every created file. Start the app with npm run dev and run npm run build once. A styled demo page is not proof that aliases and server/client boundaries build correctly.

Create project-board with the current Next.js template or initialize the existing course project. Record the CLI version, base, style, icon library, and package changes so a later generated component can be reproduced and reviewed.