Build websites that live in your terminal.

import { defineConfig } from "terminaltui";

export default defineConfig({
  name:   "My Site",
  theme:  "cyberpunk",
  banner: { text: "MY SITE", font: "ANSI Shadow" },

  // optional: serve over ssh
  serve: {
    port:           2222,
    maxConnections: 100,
  },
});

import { card, timeline, link } from "terminaltui";

export const metadata = {
  label: "About",
  icon:  "◆",
  order: 2,
};

export default function About() {
  return [
    card({
      title: "About Me",
      body:  "Full-stack developer based in Portland.",
    }),
    timeline([
      { date: "2026", title: "Started terminaltui" },
      { date: "2024", title: "Joined Acme Corp" },
    ]),
    link("GitHub", "https://github.com/me"),
  ];
}

import { card, section, badge } from "terminaltui";

type Params = { params: { slug: string } };

export default async function Project({ params }: Params) {
  const data = await fetch(
    `/api/projects/${params.slug}`
  ).then(r => r.json());

  return [
    section({ title: data.name, level: 1 }),
    badge(data.status, { tone: "success" }),
    card({ title: "Description", body: data.description }),
  ];
}

// api/stats.ts becomes GET /api/stats

export async function GET() {
  return {
    users:     45_231,
    uptime:    99.97,
    requests:  1_284_512,
  };
}

export async function POST(req: Request) {
  const body = await req.json();
  return { ok: true };
}

import { row, col, card, container } from "terminaltui";

export default function Dashboard() {
  return [
    container([
      row([
        col(statsCard, { span: 3, xs: 12 }),
        col(chartCard, { span: 9, xs: 12 }),
      ], { gap: 1 }),

      row([
        col([card({ title: "Revenue", body: "$1.2M" })], { span: 4 }),
        col([card({ title: "Users",   body: "45,231" })], { span: 4 }),
        col([card({ title: "Uptime",  body: "99.97%" })], { span: 4 }),
      ]),
    ], { maxWidth: 120, center: true })
  ];
}