implement
Kit/Getting started/Your first page

Welcome to the kit tutorial!

@implementjs/kit is a full stack framework for building implement apps on top of vite. You get file-based routing, layouts, server rendering, and prerendering without wiring any of it up yourself.

Routes live under src/routes — you can see the project's files in the tree on the left of the editor. A directory maps to a URL segment, and a page.ts file inside it is the page for that URL. The file you're looking at, src/routes/page.ts, is the page for /.

A page default-exports a component:

export default function Page() {
	return H1("Hello!");
}

Your task

  1. In src/routes/page.ts, change the heading text to say Hello, kit!.

You're done when the preview below the editor shows Hello, kit! — it updates as you type.

PreviousContextNextPages
src/routes/page.ts
import { Div, H1, P } from "@implementjs/core";

export default function Page() {
	return Div(H1("Hello!"), P("This page is src/routes/page.ts."));
}
Preview