Scaffold a project

Run this to start a new client project: the house stack, and a frontend in the renatovaldes.com architecture, built on Raster. Replace {CLIENT}.

You are scaffolding a new project for {CLIENT}. Stand up the environment and a working site in one pass: the house stack, with a frontend built on Raster in the same architecture as renatovaldes.com and noord.dev.

Stack — provision and wire together:
1. Next.js (App Router, TypeScript) on Vercel: project created, preview and production, domains wired.
2. Neon Postgres with Drizzle for schema and migrations.
3. Resend for transactional mail.
4. A GitHub repository, pushed, with the Vercel integration connected.

Design system — the site is built on Raster (github.com/rennvaldes/raster; tokens also served at noord.dev/api/raster/tokens, component registry over MCP at noord.dev/api/mcp):
- Mirror the Raster tokens as CSS custom properties in globals.css exactly as defined: color (paper, ink, gray, plus the dark set), type scale, radii, breakpoints. data-theme="dark" flips the theme; both themes work from day one.
- Typography: Messina Sans variable (woff2, licensed; copy from an existing project, never bundle publicly) with the system stack fallback; weights 500 and 600; never all caps.

Frontend architecture — mirror renatovaldes.com as expressed on noord.dev:
- The visible background column grid: 204px modules (184px column + 20px gutter) drawn as hairlines behind everything. Content boxes span whole modules with round() grid snap, so edges step from grid line to grid line on resize; at ≤480px switch to the two-column mobile grid with 25px gutters.
- Fixed chrome: the mark top-left, theme toggle top-right, hamburger and panel at ≤640px, the breadcrumb bar on document pages, the TOC rail at ≥900px, a ~592px reading column.
- Components come from the Raster registry: buttons, quiet fields, hairline tables, chips, cards. Monochrome, emphasis from weight and spacing; no accent hue unless the client's brand mandates one.
- Pages: a landing in the poster architecture (sticky rail beside a scrolling column at wide widths, stacked below), plus the gated client-space routes (/{client}/proposal, /workshop, /deliverables, /billing) scaffolded empty on the house templates, with the password gate and admin row created alongside.
- Motion stays quiet: 0.15–0.3s ease, color and opacity only, nothing bounces; all loops respect prefers-reduced-motion.

Then verify: npx tsc --noEmit and lint pass; the grid snaps correctly at 1024, 1280, and 1440; both themes hold on every page; accessibility clears WCAG AA. Commit and push, then report the URLs, the environment variables that were set, and what remains manual (DNS, the font license file).

Skill

New Project Setup

A complete client environment, scaffolded on the whole stack.

Invoke/new-project-setup

01What it does

A complete client environment, scaffolded on the whole stack.

Stands up everything a new client engagement runs on, in one pass: a Vercel project with the domains wired, a Neon Postgres database, Resend for transactional mail, and a codebase scaffolded on the Raster design system: grid, tokens, components, and the gated client-space routes.

The result is not a boilerplate but the studio's actual working environment: the same proposal, workshop, and deliverables surfaces every existing client has, empty and ready for content.

02How it runs

Step by step

Give it the client name and market; it derives slugs, domains, and the bilingual file pair.
It provisions Vercel, Neon, and Resend, then scaffolds routes and typed content files from the templates.
The proposal entry, password gate, and admin row are created alongside.
Verifies with tsc and lint; commits, and asks before pushing or deploying.

03What comes out

The result

A deployed, gated client environment on the full stack, ready for the proposal within the hour.

Noord Studio — Resources · New Project Setup · Internal reference