Skip to main content
Next.js app with Tailwind and shadcn/ui using Bun, a fast JavaScript runtime and package manager. The dev server starts automatically on port 3000.
For an npm-based version, see Next.js App.

Set up Next.js with Bun

Use Bun for faster installs and hot reloads. This template includes TypeScript, Tailwind, and all shadcn components.
// template.ts
import { Template, waitForURL } from 'e2b'

export const template = Template()
  .fromBunImage('1.3')
  .setWorkdir('/home/user/nextjs-app')
  .runCmd(
    'bun create next-app --app --ts --tailwind --turbopack --yes --use-bun .'
  )
  .runCmd('bunx --bun shadcn@latest init -d')
  .runCmd('bunx --bun shadcn@latest add --all')
  .runCmd(
    'mv /home/user/nextjs-app/* /home/user/ && rm -rf /home/user/nextjs-app'
  )
  .setWorkdir('/home/user')
  .setStartCmd('bun --bun run dev --turbo', waitForURL('http://localhost:3000'))

Build and publish

Build the template. Bun makes the initial setup noticeably faster than npm.
// build.ts
import { Template, defaultBuildLogger } from 'e2b'
import { template as nextJSTemplate } from './template'

await Template.build(nextJSTemplate, 'nextjs-app-bun', {
  cpuCount: 4,
  memoryMB: 4096,
  onBuildLogs: defaultBuildLogger(),
})

Access your app

Create a sandbox and grab the URL. The dev server with Turbopack is already running on port 3000.
import { Sandbox } from 'e2b'

const sandbox = await Sandbox.create('nextjs-app-bun', { timeoutMs: 60_000 })

const url = sandbox.getHost(3000)
console.log('Next.js app running at:', url)