Create an app

Create an app against a host product’s contract to use its components, tools, and slots. You need Node.js, a package manager, and the host’s Patchsmith API URL. Start with the Patchsmith command-line interface (CLI):

npx patchsmith@beta init

Follow the prompts for your app name and the product’s Patchsmith API URL. The CLI reads its contract, creates a starter app, and generates bindings for its capabilities.

App structure

These are the main files for a host with a panel slot and a / view:

my-app

src

slots

panel

index.view.tsx

functions

greeting.ts

root.tsx

server.ts

patchsmith.gen.ts

patchsmith.config.ts

vite.config.ts

package.json

tsconfig.json

Use these files to add UI, backend logic, and configuration:

Location	Purpose
`src/slots/`	UI views, grouped by slot.
`src/root.tsx`	The shared UI shell.
`src/functions/` and `src/server.ts`	Backend functions and their registration.
`src/db/`	Database schema, connection, and migrations.
`src/patchsmith.gen.ts`	Generated components, tools, and types; refreshed by `patchsmith generate`.
`patchsmith.config.ts`	The host URL and app logos.
`vite.config.ts`	Build configuration.

Start by writing UI for a slot.

Getting Started

App Capabilities

Writing apps

App structure

​App structure

App structure