Skip to main content

One Server Philosophy

One server. One deployment. Zero complexity. Unlike other platforms where you build locally and deploy separately, tinykit runs the builder AND your app on the same server. Edit at /tinykit, ship at /.
Architecture comparison

Traditional deployment vs tinykit


URL Structure

Your tinykit instance serves everything from a single domain:
tinykit Server (Railway)
├── /tinykit/dashboard  → Project list (you)
├── /tinykit/builder    → Edit current domain's app (you)
├── /                   → Your generated app (users)
├── /api/agent          → AI endpoints
├── /api/projects       → Project operations
└── /_pb                → PocketBase admin
URL routing diagram

Request routing

PathPurposeWho Uses It
/Your generated appEnd users
/tinykit/dashboardList all projectsYou (developer)
/tinykit/builderEdit app for current domainYou (developer)
/tinykit/builder?id=XEdit specific projectYou (developer)
/api/agentAI code generationBuilder
/_pbPocketBase adminYou (optional)

Domain-Based Routing

Run hundreds of apps from one tinykit instance. Each domain serves a different app:
calculator.myserver.com/           → Serves calculator app
calculator.myserver.com/tinykit    → Edit calculator app

blog.myserver.com/                 → Serves blog app
blog.myserver.com/tinykit          → Edit blog app

recipes.myserver.com/              → Serves recipes app
recipes.myserver.com/tinykit       → Edit recipes app
How it works:
  1. Point multiple domains to your tinykit server
  2. Each domain is associated with a project in PocketBase
  3. Root URL (/) serves the pre-built HTML for that domain’s project
  4. /tinykit lets you edit the project for the current domain
Unknown domains redirect to /tinykit/new?domain=X to create a new project.

Tech Stack

SvelteKit

Fast, modern framework for the builder and generated apps

Monaco Editor

VS Code’s editor engine for a familiar coding experience

OpenAI / Anthropic / Gemini

Your choice of AI provider for code generation

PocketBase

Embedded database for data persistence

Tailwind CSS

Utility-first styling for rapid UI development

TypeScript

Type safety throughout the codebase

Data Storage

All project data is stored in a single PocketBase collection (_tk_projects):
_tk_projects
├── frontend_code    → App.svelte (your app's code)
├── backend_code     → Compiled HTML (production build)
├── content          → Content fields (JSON)
├── design           → CSS variables (JSON)
├── agent            → Conversation history (JSON)
├── snapshots        → Time travel history (JSON)
└── domain           → Associated domain
Everything in one collection means simple backups and easy migrations.

Data Flow

1

You Chat with AI

Send a prompt like “Create a todo list app” to the AI Agent panel.
2

AI Generates Code

The AI responds with code, which streams to your browser in real-time.
3

Files are Saved

Generated code is saved to the project’s frontend_code field.
4

Preview Updates

The live preview compiles and shows your changes immediately.
5

Build for Production

Server compiles Svelte to standalone HTML, saved to backend_code.
6

Users See Changes

Anyone visiting your root URL sees the updated app instantly.
Data flow diagram

Data flow from prompt to production


Build System

Preview uses in-browser Svelte compilation for instant feedback. Production uses server-side compilation:
  • Svelte 5’s native compile() function
  • Generates standalone HTML with CDN-based imports
  • Auto-builds on save
  • Result stored in backend_code field

Deployment Options

While Railway is recommended for simplicity, you can deploy anywhere that runs Node.js:
fly launch
fly secrets set LLM_API_KEY=sk-...
fly deploy
Connect your GitHub repo and configure environment variables in the dashboard.
git clone https://github.com/tinykit-studio/tinykit.git
cd tinykit
npm install
npm run build
npm run preview
Use PM2 or systemd to keep it running.
FROM node:20-alpine
WORKDIR /app
COPY . .
RUN npm install && npm run build
CMD ["npm", "run", "preview"]

Exporting Your App

Want to take your generated app elsewhere? Export the compiled HTML:
# Your app is just static HTML
# Download from the builder or copy backend_code

# Deploy anywhere
# - Vercel: vercel deploy
# - Netlify: netlify deploy
# - GitHub Pages: push to gh-pages branch
Your app is just HTML, CSS, and JS. No vendor lock-in.