Getting Started

Installation

Requires Bun runtime:

curl -fsSL https://bun.sh/install | bash

Install Tkeron:

bun install -g tkeron

Verify:

tk

Create Your First Project

Initialize a New Project

tk init my-website
cd my-website

This creates a new directory with a sample project structure:

my-website/
├── websrc/              # Source files
│   ├── index.html       # Main page
│   ├── index.ts         # TypeScript for index
│   ├── index.pre.ts     # Pre-rendering script
│   └── *.com.html       # Sample components
├── tkeron.d.ts          # TypeScript definitions
└── tsconfig.json        # TypeScript configuration (auto-generated)

Initialize in Current Directory

tk init .

Force Overwrite

tk init my-website --force

Build Your Project

tk build

Source is always websrc/, output is always web/. No arguments needed.

Output structure:

web/
├── index.html       # Processed HTML (components inlined)
├── index.js         # Compiled TypeScript
└── ...              # Other processed files

.com.html, .com.ts, .com.md, and .pre.ts files are not copied to output — they're processed and inlined.

Start Development Server

tk dev

This will:

Build your project
Start a server at http://localhost:3000
Watch for file changes
Automatically reload the browser on changes

Custom port:

tk dev 8080

Custom port and host:

tk dev 8080 0.0.0.0

Your First Component

1. Create a Component File

Create websrc/my-greeting.com.html:

<div style="padding: 1rem; background: #f0f9ff; border-radius: 8px;">
  <h2>Hello from Tkeron!</h2>
  <p>This is a reusable component.</p>
</div>

2. Use the Component

Edit websrc/index.html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>My First Tkeron Site</title>
  </head>
  <body>
    <h1>My Website</h1>
    <my-greeting></my-greeting>
    <my-greeting></my-greeting>
  </body>
</html>

3. Build and View

tk build

Open web/index.html — the greeting component is inlined twice, with no <my-greeting> tags remaining.

What Gets Processed?

File Type	Purpose	In Output?
`.html`	Regular HTML pages	Yes
`.ts` / `.js`	Scripts for pages	Yes (compiled)
`.com.html`	HTML components	No (inlined)
`.com.ts`	TypeScript components	No (inlined)
`.com.md`	Markdown components	No (inlined)
`.pre.ts`	Pre-rendering scripts	No (executed)
`.css`	Stylesheets	Yes
Images, fonts, etc.	Static assets	Yes

Component Resolution

Components are resolved in this order:

Same directory as the file using it
Any subdirectory of websrc/ (glob search)

This means you can organize components in folders and they'll be found automatically.

Common Commands

tk                    # Show version
tk build              # Build project
tk dev                # Start dev server
tk dev 8080           # Dev server on port 8080
tk init my-project    # Initialize new project
tk init .             # Initialize in current directory
tk init my-project --force  # Force overwrite

Next Steps

HTML Components — Reusable markup
TypeScript Components — Dynamic logic
Markdown Components — Content in Markdown
Pre-rendering — Build-time transformations
CLI Reference — All available options
Best Practices — Tips and patterns