Quick Start
Get a Streak.js site running in under 5 minutes.
Prerequisites
- Bun >= 1.0 — Streak.js uses Bun as its runtime and package manager. Install it from bun.sh.
- Node.js (optional) — not required, but compatible if your tooling depends on it.
Create a New Project
Note: The
create-streak-appCLI is coming soon. For now, use the hello-streak-app starter repository:git clone https://github.com/valoriz/hello-streak-app.git my-app && cd my-app && bun installSee Hello Streak App for the full getting-started guide.
Project Structure
my-app/
src/
handlers/ ← async data providers (one per page)
layouts/ ← full HTML document templates with WidgetPlaceholders
widgets/ ← stateless TSX components rendered at build time
public/
assets/ ← JS/CSS files loaded at runtime via the asset worker
styles/ ← compiled Tailwind CSS
out/ ← generated static output (created by build)
streak.sitemap.json
tsconfig.json
package.json
Start the Dev Server
bun run dev The dev server starts on port 3690. It renders pages on demand and reloads on file changes.
Build for Production
bun run build This compiles Tailwind CSS, then runs streak-forge pre-build. The output is written to out/ — one folder per page, each containing an index.html.
out/
homeRenderId/
index.html
aboutRenderId/
index.html
Adding a New Page — Quick Checklist
Adding a page to a Streak site requires four files and one sitemap entry. Here is the minimum checklist:
Sitemap entry — add a new object to
streak.sitemap.jsonwithurl,renderId,dataHandler,rootLayout, andwidgets[].Data handler — create
src/handlers/MyPageDataHandler.ts. Default-export an async function that returns{ status: 200, WidgetId: { ... } }.Layout — reuse an existing layout or create a new one in
src/layouts/. Add a<WidgetPlaceholder id="WidgetId" type="WidgetType" />for every widget.Widget — create
src/widgets/MyWidget.tsx. Default-export a function that receivesprops.dataand returns JSX.Verify — run
bun run devand navigate to the new URL on port 3690.