Installation

Prerequisites, the install command, what the CLI asks, and what to do next.

Quick start

Node.js 20.9+ is required. pnpm is recommended; npm, yarn, and bun are also supported.

$ pnpm dlx virastack@latest

This opens the interactive menu. For silent installs and every flag, see the CLI page.

What does the CLI ask?

Project name: folder name
Template: Next.js App Router or TanStack Start
i18n: do you want the multi-language template?
Tools: optional packages like @virastack/mask and @virastack/password.

After installation

Dependencies install, then ViraStack AI writes AGENTS.md, CLAUDE.md, and .cursor/rules.

Two design skills are added under .agents/skills/:

emil-design-eng: Emil Kowalski design / UI language
make-interfaces-feel-better: Jakub Krehel interface feel and animation

Enter the project directory and start the dev server:

$ pnpm dev

The homepage renders the sample landing feature. Delete it when you build your product.

First steps (FIXME)

Templates mark the first steps with FIXME: comments. Search the repo for that marker, then update these in order:

Step 1: Site metadata (src/config/site.config.ts): replace the default description and social links with your product name, copy, and URLs. Name and base URL come from .env:
- For Next.js: NEXT_PUBLIC_APP_NAME, NEXT_PUBLIC_APP_URL
- For TanStack Start: VITE_APP_NAME, VITE_APP_URL
Step 2: Remote images (Next.js only) (next.config.ts): add your CDNs or media hosts under images.remotePatterns. This FIXME exists only in Next templates; TanStack Start has no equivalent.
Step 3: API auth header (src/lib/api.ts): when you pick an auth solution, attach the token in buildHeaders (the commented Authorization: Bearer example). Shared across all templates.
Step 4: Env and assets: update name/URL in .env; when adding variables, keep src/env.ts and .env.example in sync with your template’s prefix (NEXT_PUBLIC_* or VITE_*). Swap favicon and static files under public/.

After installation

Dependencies install, then ViraStack AI writes AGENTS.md, CLAUDE.md, and .cursor/rules.

Two design skills are added under .agents/skills/:

emil-design-eng: Emil Kowalski design / UI language

make-interfaces-feel-better: Jakub Krehel interface feel and animation

Enter the project directory and start the dev server:

$ pnpm dev

The homepage renders the sample landing feature. Delete it when you build your product.

First steps (FIXME)

Templates mark the first steps with FIXME: comments. Search the repo for that marker, then update these in order:

Step 1: Site metadata (src/config/site.config.ts): replace the default description and social links with your product name, copy, and URLs. Name and base URL come from .env:

For Next.js: NEXT_PUBLIC_APP_NAME, NEXT_PUBLIC_APP_URL
For TanStack Start: VITE_APP_NAME, VITE_APP_URL

Step 2: Remote images (Next.js only) (next.config.ts): add your CDNs or media hosts under images.remotePatterns. This FIXME exists only in Next templates; TanStack Start has no equivalent.

Step 3: API auth header (src/lib/api.ts): when you pick an auth solution, attach the token in buildHeaders (the commented Authorization: Bearer example). Shared across all templates.

Step 4: Env and assets: update name/URL in .env; when adding variables, keep src/env.ts and .env.example in sync with your template’s prefix (NEXT_PUBLIC_* or VITE_*). Swap favicon and static files under public/.