Install packages manually

Use manual installation when you already have a Next.js app and want to adopt Tulip gradually.

The best manual path is to install only the package group needed by the screen you are building, then add deeper packages as the workflow requires them.

Foundation packages

Most Tulip apps start with the app shell, core utilities, auth integration, and UI package:

pnpm add @tulip-systems/app @tulip-systems/core @tulip-systems/auth @tulip-systems/ui

The app shell also expects the common React and Next.js runtime dependencies used by the maintained templates:

pnpm add next react react-dom nuqs @tanstack/react-query @tanstack/react-query-devtools next-themes

For auth and forms, install the auth stack used by the Tulip templates:

pnpm add better-auth @better-auth/passkey react-hook-form @hookform/resolvers zod

Data screen packages

Install these when you are building record lists, filters, tables, or inline editing:

pnpm add @tulip-systems/query @tulip-systems/data-tables @tulip-systems/commands @tulip-systems/inline

Useful peer/runtime packages for data screens:

pnpm add @tanstack/react-table @orpc/client @orpc/server @orpc/tanstack-query

File packages

Install Storage when records need uploads or attachments:

pnpm add @tulip-systems/storage

Install Drive when users need folders, file picking, provider-backed document trees, or file manager workflows:

pnpm add @tulip-systems/drive @tulip-systems/drive-local @tulip-systems/drive-google

Content and AI packages

Install the editor packages when users need rich-text editing:

pnpm add @tulip-systems/editor @tulip-systems/editor-storage

Install the AI package when assistants need access to typed application tools:

pnpm add @tulip-systems/ai ai

Styles

Import package styles from your root app stylesheet or root layout as needed:

import "@tulip-systems/app/styles.css";
import "@tulip-systems/ui/styles.css";

Some feature packages also expose styles, such as Drive and AI. Import those when you use their client UI.

Manual setup checklist

1. Wrap the root layout with Tulip Providers.
2. Configure auth and add auth routes.
3. Add an admin layout with AdminLayout, AdminContent, and a sidebar.
4. Add your router client/server setup if the screen uses server data.
5. Add package-specific styles when you render feature UI.

Prefer the template when possible

Manual install is useful for existing apps, but the scaffolded templates are the source of truth for a complete working setup. If you are starting fresh, use create-tulip-app first and copy patterns from the generated app.

Next step