Create your app

Over the next seven chapters you'll build a small reading list: a page of books, a page for each book, a star rating, a form for suggestions and an API that picks a book at random. Each chapter adds one working feature and explains the idea behind it. You need Bun 1.4.4 or newer.

Create the project

bunx @sxnistxr/optz create my-app
cd my-app
bun install

create writes a starter app into my-app with a versioned dependency on the published OPTZ package. bun install installs its dependencies.

Start the dev server

bun run dev

Open http://127.0.0.1:3001. You'll see "Hello, world." and a button that counts clicks.

Now open app/lib/greeting.ts, change Hello to Welcome, and save. The page updates in place, without a reload. Change it back when you're done.

Look around

Every file in app/routes is a page, and its path is its URL. API routes live in app/api.

• app/routes/index.tsx becomes /
• app/routes/about.tsx becomes /about
• app/routes/users/[name].tsx becomes /users/ada and /users/grace
• app/routes/time.tsx becomes /time, rendered for every request
• app/api/hello.ts becomes /api/hello
• app/components/Counter.island.tsx becomes the only JavaScript on /

Commands you'll use

Keep the dev server running. In the next chapter you'll add your first page.