tekir

Next.js Frontend

Run a Next.js app behind your tekir API on the same port. SSR, file-based routing, and the full Next ecosystem; tekir handles the API surface and proxies the rest.

Overview

@tekir/nextembeds Next.js into your tekir process. In dev it spins up Next's dev server (with optional Turbopack) on a random localhost port and proxies non-API requests to it. In production it runs Next's standalone request handler against the pre-built output. Either way you ship a single tekir entry and a single port.

Install

bun add @tekir/next next react react-dom
bun add -d @types/react @types/react-dom

next and reactare peer dependencies — you control the versions. @tekir/next targets Next 14+.

Setup

index.ts
import { tekir } from '@tekir/core'

const { router, start } = await tekir({
  config: { app: { port: 3000 } },
  frontend: { type: 'next' }
})

// API routes go through tekir; everything else falls through to Next.js
router.get('/api/hello', () => ({ message: 'from tekir' }))

start()

Project Layout

Standard Next layout, with tekir at the root:

my-app/
├── index.ts            # tekir entry — your API + frontend integration
├── next.config.ts
├── tsconfig.json
├── pages/              # or app/ (Next 13+ app router)
│   ├── _app.tsx
│   ├── _document.tsx
│   └── index.tsx
└── package.json

If your Next project lives in a subdirectory, point tekir at it:

frontend: {
  type: 'next',
  dir: './frontend'   // Next.js project lives in a subfolder
}

Dev Server & Turbopack

By default tekir starts the regular Next dev server. Opt into Turbopack for faster cold starts and HMR:

frontend: {
  type: 'next',
  turbopack: true   // opt into Next 14+ Turbopack dev server
}

Both modes share a single port with the tekir API. Routes you define with router.get(...) take precedence; everything else falls through to Next.

Production Build

tekir build       # next build under the hood
tekir serve       # production: serves prebuilt Next output

build runs next buildvia Next's internal build API, suppressing its console output and re-emitting progress through the tekir logger. start boots tekir with NODE_ENV=production and serves the pre-built output.

Environment Variables

Use Next's native NEXT_PUBLIC_*convention — Next inlines those values into the client bundle at build time, leaves everything else on the server:

.env
# .env (project root)
NEXT_PUBLIC_API_URL=https://api.example.com   # exposed to the browser
DATABASE_URL=postgres://...                   # stays server-side
pages/index.tsx
// pages/index.tsx
export default function Home() {
  return <p>{process.env.NEXT_PUBLIC_API_URL}</p>
  // Next replaces this with the literal string at build time.
}

Options

frontend: {
  type: 'next',
  dir: '.',           // path to the Next project (defaults to cwd)
  dev: false,         // force production mode regardless of NODE_ENV
  turbopack: true,    // use Turbopack dev server (Next 14+)
  conf: {             // raw next.config object — same shape as next.config.ts
    reactStrictMode: true,
    images: { domains: ['cdn.example.com'] },
  },
}

conf accepts the same object shape as a regular next.config.tsdefault export — useful when you want to keep config inline rather than in a separate file.

Deploy the build output with the tekir entry as you would any Node service: a Docker image with Bun installed, a process manager, or a serverless platform that runs Bun.