docs / Introduction

Getting Started

What Vesk is, what .vsk files look like, how to scaffold a project, and the commands that drive the compiler.

Vesk is a compiler-first framework. You write one component model in .vsk files (a TypeScript superset), and the compiler emits optimized output per target: server-rendered HTML plus direct-DOM client code for the web, and Kotlin for native. There is no diffing runtime shipped to your users.

The compiler process is explicit — it has no hidden evaluator. Source is preprocessed, parsed, lowered to an intermediate representation, then codegen'd to platform code.

Create a project

terminal

									
										npx create-vesk@latest my-app
cd my-app
npm install
npm run dev

create-vesk scaffolds a complete app (routes, layout, middleware, API routes, Tailwind entry). The package scripts then drive the compiler. The dev server prints its address when it starts and reports each rebuild:

terminal

									
										vesk dev server at http://localhost:3000 (listening on localhost)
vesk dev: rebuilt in 11ms

The dev server watches app/ and public/, recompiles affected routes on change, serves /api/* routes and middleware, and pushes HMR updates over a WebSocket.

Project layout

my-app/

									
										app/
  layout.vsk              # root layout — wraps every route via {props.children}
  page.vsk                # /
  about/page.vsk          # /about
  blog/page.vsk           # /blog
  blog/[slug]/page.vsk    # /blog/:slug
  posts/page.vsk          # data-fetching example (useFetch + tracked cell)
  statements/page.vsk     # statement-mode example
  not-found.vsk           # rendered when a route throws NotFoundError
  error.vsk               # route error boundary
  middleware.ts           # app middleware (onion model)
  api/posts/route.ts      # GET /api/posts
  api/hello/route.ts      # GET /api/hello
src/global.css            # Tailwind entrypoint
public/                   # static assets
vesk.config.ts
package.json

CLI commands

Command	What it does
vesk dev [-p <port>]	HMR dev server on app/ (default port 3000)
vesk build [--platform <name>]	Production build into .vesk/ (platform auto-detected, defaults to node)
vesk start [-p <port>]	Production server serving the .vesk/ build (default port 3000)
vesk typecheck	Typechecks .vsk/.ts in app/ via tsc-in-.vsk (strict by default)
vesk seo [--strict]	Runs the SEO audit against app/
vesk init	Creates src/global.css (Tailwind entrypoint) if missing

Type safety

Every .vsk file is a TypeScript superset: all TS constructs parse, survive codegen, and pass through vskToTsx for tsc. Types are checked on the component boundary just like exported functions, and `vesk typecheck` runs the same tsc-in-.vsk pipeline.