Introduction

What is x?

x is a full-stack React framework built on Bun. File-based routing, SSR, static generation, API routes, server functions, islands, and a content layer — all in one process, zero orchestration.

Why x exists

Most stacks split concerns across multiple tools: a bundler, a server, a static host, a separate API layer. x keeps everything in one Bun process. Drop a file in src/pages, get a route. Mark a page static and it prerenders at build time. Leave it as server mode and it renders per request. API routes and server functions live alongside your pages — same types, same runtime.

The package ecosystem

x ships as three focused npm packages. You typically install @thexjs/cli and @thexjs/core through the project scaffolder; add @thexjs/env when you need validated environment variables.

@thexjs/core

Rendering engine — routing, SSR/SSG, islands, server functions, content, data layer.

@thexjs/cli

The x command — dev server, production build, and start.

@thexjs/env

Type-safe environment variable validation with fail-fast errors.

A minimal page

Every x app starts with file-based routes. Here is the simplest possible page:

src/pages/index.tsx

import type { RouteProps } from "@thexjs/core";export const mode = "static";export default function HomePage({}: RouteProps) {  return <h1>Hello from x</h1>;}

Run x dev and visit http://localhost:3000. That is the entire loop.

Static vs server

Pages default to server-rendered (SSR). Opt into build-time prerendering per page:

route mode

export const mode: "static" | "server" = "static";

Static pages ship as plain HTML in .x/client/ — deployable to any static host. Server pages need a running Bun process via x start.

Install x Back to docs