hatk.dev
AppView in a box as a Vite plugin thing
hatk.dev
chadtmiller.com
1---
2title: Quickstart
3description: Create and run your first hatk project in under two minutes.
4---
5
6## Prerequisites
7
8- **Vite+** — install with `curl -fsSL https://vite.plus | bash` (or `irm https://vite.plus/ps1 | iex` on Windows)
9- **Docker** — needed to run the local PDS (Personal Data Server) during development
10
11Vite+ manages Node.js and your package manager automatically. Run `vp help` to verify it's installed.
12
13## Create a new project
14
15```bash
16vp create github:hatk-dev/hatk-template-starter
17```
18
19This scaffolds a full-stack project with a SvelteKit frontend, OAuth login, seed data, and everything wired together. The generated project includes:
20
21```
22my-appview/
23├── app/ # SvelteKit frontend (routes, components, styles)
24├── server/ # Backend logic (hooks, feeds, XRPC handlers)
25├── lexicons/ # AT Protocol schemas for your data types
26├── seeds/ # Test fixture data for local development
27├── db/ # Database reference schemas
28├── hatk.config.ts # Project configuration
29├── hatk.generated.ts # Auto-generated types (server)
30├── hatk.generated.client.ts # Auto-generated types (client)
31├── vite.config.ts # Vite+ / SvelteKit config
32├── svelte.config.js # SvelteKit adapter config
33├── tsconfig.json # TypeScript config (app)
34├── tsconfig.server.json # TypeScript config (server)
35└── docker-compose.yml # Local PLC directory and PDS for development
36```
37
38## Start the dev server
39
40```bash
41cd my-appview
42npx svelte-kit sync
43vp dev
44```
45
46This does three things automatically:
47
481. Starts a local PDS via Docker (your own mini AT Protocol server)
492. Runs seed data to create test accounts and records
503. Starts the hatk backend and SvelteKit dev server with hot reload
51
52## See it running
53
54Open `http://127.0.0.1:3000` in your browser. You should see the starter app running with seeded data. Both the frontend and API are served on the same port.
55
56Try hitting an endpoint directly:
57
58```bash
59curl http://127.0.0.1:3000/xrpc/dev.hatk.describeCollections
60```
61
62This returns the data collections your server is indexing, derived from your lexicon schemas.
63
64## Next steps
65
66- [Project Structure](/getting-started/project-structure) -- understand each file and directory
67- [Configuration](/getting-started/configuration) -- customize `hatk.config.ts`
68- [Feeds](/guides/feeds) -- build custom feed algorithms
69- [Auth](/guides/auth) -- add login and authenticated actions