XBPjPKA7{3a&H+~xQvr>C_A;7=JrfK~$M2pCh>|xLz>W6SCs4qC|#V`)#
z)0C|?$o>jzh<|-cpfK7osU{Xp5PG4-K+L2G=)c3f&}H&M3wo7TlO_UJjQ-Oq&_
zjAc9=nNIYz{c3zxOiS5UfcE1}8#iI4@uy;$Q7>}u`j+OU0N<*Ezx$k{x_27+{s2Eg
z`^=rhtIzCm!_UcJ?Db~Lh-=_))PT3{Q0{Mwdq;0>ZL%l3+;B&4!&xm#%HYAK|;b456Iv&&f$VQHf`
z>$*K9w8T+paVwc7fLfMlhQ4)*zL_SG{~v4QR;IuX-(oRtYAhWOlh`NLoX0k$RUYMi
z2Y!bqpdN}wz8q`-%>&Le@q|jFw92ErW-hma-le?S
z-@OZt2EEUm4wLsuEMkt4zlyy29_3S50JAcQHTtgTC{P~%-mvCTzrjXOc|{}N`Cz`W
zSj7CrXfa7lcsU0J(0uSX6G`54t^7}+OLM0n(|g4waOQ}bd3%!XLh?NX9|8G_|06Ie
zD5F1)w5I~!et7lA{G^;uf7aqT`KE&2qx9|~O;s6t!gb`+zVLJyT2T)l*8l(j
literal 0
HcmV?d00001
diff --git a/bun/react-router.config.ts b/bun/react-router.config.ts
new file mode 100644
index 0000000..6ff16f9
--- /dev/null
+++ b/bun/react-router.config.ts
@@ -0,0 +1,7 @@
+import type { Config } from "@react-router/dev/config";
+
+export default {
+ // Config options...
+ // Server-side render by default, to enable SPA mode set this to `false`
+ ssr: true,
+} satisfies Config;
diff --git a/bun/server.ts b/bun/server.ts
new file mode 100644
index 0000000..3f8ee85
--- /dev/null
+++ b/bun/server.ts
@@ -0,0 +1,152 @@
+import type { Server } from 'bun'
+import fs from 'node:fs'
+import path from 'node:path'
+import process from 'node:process'
+import url from 'node:url'
+import type { ServerBuild } from 'react-router'
+import { createRequestHandler } from 'react-router'
+
+type RSCServerBuild = {
+ fetch: (request: Request, client?: {
+ address: string
+ family: 'IPv4' | 'IPv6'
+ port: number
+ }) => Response
+ publicPath: string
+ assetsBuildDirectory: string
+}
+
+type IsomorphicServerBuild = (RSCServerBuild & { isRsc: true }) | (ServerBuild & { isRsc: false })
+
+async function resolveBuildModule() {
+ const buildPathArg = process.argv[process.argv.length - 1] ?? undefined
+ if (!buildPathArg) {
+ console.error(`Usage example: bun run server.ts build/server/index.js`)
+ process.exit(1)
+ }
+ const buildPath = path.resolve(buildPathArg)
+ const buildModule = await import(url.pathToFileURL(buildPath).href)
+ return { buildPath, buildModule }
+}
+
+async function prepareServer(buildPath: string, buildModule: any) {
+ let port = parseNumber(process.env.PORT) ?? 3000
+ let build: IsomorphicServerBuild
+
+ if (buildModule.default && typeof buildModule.default === 'function') {
+ const config = {
+ publicPath: '/',
+ assetsBuildDirectory: '../client',
+ ...(buildModule.unstable_reactRouterServeConfig || {}),
+ }
+ build = {
+ fetch: buildModule.default,
+ publicPath: config.publicPath,
+ assetsBuildDirectory: path.resolve(path.dirname(buildPath), config.assetsBuildDirectory),
+ isRsc: true,
+ } satisfies IsomorphicServerBuild
+ } else {
+ build = {
+ ...(buildModule as ServerBuild),
+ isRsc: false,
+ } satisfies IsomorphicServerBuild
+ }
+
+ return { port, build }
+}
+
+function runBunServer(build: IsomorphicServerBuild, port: number) {
+ // It is recommended to use a dedicated static file server for production, e.g. nginx, with gzip compression enabled
+ // This is a simple fallback using Bun to stream static files, but it's not serving them compressed.
+ const handleStaticFiles = (req: Request): Response | null => {
+ const filePath = new URL(req.url).pathname
+ if (!filePath.startsWith(build.publicPath)) {
+ return null
+ }
+
+ const safeFilePath = filePath.replace(/^\/+/, '').replace(/\.\./g, '').replace(/\/\//, '/')
+ const fullPath = path.join(build.assetsBuildDirectory, safeFilePath)
+
+ if (fs.existsSync(fullPath) && !fs.statSync(fullPath).isDirectory()) {
+ const file = Bun.file(fullPath)
+ return new Response(file, {
+ headers: {
+ 'Content-Type': file.type,
+ 'Cache-Control': 'public, max-age=31536000, immutable', // 1 year
+ },
+ })
+ }
+
+ return null
+ }
+
+ const server: Server = Bun.serve({
+ port,
+ // reusePort: true, // uncomment to allow multiple instances to listen on the same port (e.g. for clustering)
+ development: process.env.NODE_ENV !== 'production',
+ fetch: async (req) => {
+ const startTime = Date.now()
+ const staticFile = handleStaticFiles(req)
+ if (staticFile) {
+ return staticFile
+ }
+
+ let response: Response
+ try {
+ if (build.isRsc) {
+ const remote = server.requestIP(req)
+ response = build.fetch(req, remote ?? undefined)
+ if (typeof (response as any).then === 'function') {
+ response = await response
+ }
+ } else {
+ response = await createRequestHandler(build, process.env.NODE_ENV)(req)
+ }
+ } catch (error: unknown) {
+ console.error('Uncaught error', error)
+ response = new Response('Internal Server Error', { status: 500 })
+ }
+
+ // Add the total server processing time header to the response.
+ // @see https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Server-Timing
+ const serverTiming = Date.now() - startTime
+ response.headers.set('Server-Timing', `total;dur=${serverTiming}`)
+ logRequest(req, response, serverTiming)
+ return response
+ },
+ })
+
+ ;['SIGTERM', 'SIGINT'].forEach((signal) => {
+ process.once(signal, () => server?.stop())
+ })
+
+ return server
+}
+
+function parseNumber(raw?: string | null) {
+ if (raw === undefined || raw === null) return undefined
+ let maybe = Number(raw)
+ if (Number.isNaN(maybe)) return undefined
+ return maybe
+}
+
+function logRequest(req: Request, response: Response, serverTiming: number): number {
+ const pathname = new URL(req.url).pathname
+ const statusCode = response.status
+
+ console.log(`${req.method.toUpperCase()} ${pathname} - HTTP ${statusCode} - ${serverTiming}ms`)
+
+ return serverTiming
+}
+
+async function main() {
+ const buildModule = await resolveBuildModule()
+ const { port, build } = await prepareServer(buildModule.buildPath, buildModule.buildModule)
+ if (!build.publicPath || !build.assetsBuildDirectory) {
+ throw new Error(`${buildModule.buildPath} is not a valid build file.`)
+ }
+ const server = runBunServer(build, port)
+ console.log(`[Bun Server] Listening on ${server.url}`)
+}
+
+main()
diff --git a/bun/tsconfig.json b/bun/tsconfig.json
new file mode 100644
index 0000000..dc391a4
--- /dev/null
+++ b/bun/tsconfig.json
@@ -0,0 +1,27 @@
+{
+ "include": [
+ "**/*",
+ "**/.server/**/*",
+ "**/.client/**/*",
+ ".react-router/types/**/*"
+ ],
+ "compilerOptions": {
+ "lib": ["DOM", "DOM.Iterable", "ES2022"],
+ "types": ["node", "vite/client"],
+ "target": "ES2022",
+ "module": "ES2022",
+ "moduleResolution": "bundler",
+ "jsx": "react-jsx",
+ "rootDirs": [".", "./.react-router/types"],
+ "baseUrl": ".",
+ "paths": {
+ "~/*": ["./app/*"]
+ },
+ "esModuleInterop": true,
+ "verbatimModuleSyntax": true,
+ "noEmit": true,
+ "resolveJsonModule": true,
+ "skipLibCheck": true,
+ "strict": true
+ }
+}
diff --git a/bun/vite.config.ts b/bun/vite.config.ts
new file mode 100644
index 0000000..4a88d58
--- /dev/null
+++ b/bun/vite.config.ts
@@ -0,0 +1,8 @@
+import { reactRouter } from "@react-router/dev/vite";
+import tailwindcss from "@tailwindcss/vite";
+import { defineConfig } from "vite";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+export default defineConfig({
+ plugins: [tailwindcss(), reactRouter(), tsconfigPaths()],
+});
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index a16122e..a3b7d4c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -30,6 +30,52 @@ importers:
specifier: ^2.0.3
version: 2.0.3
+ bun:
+ dependencies:
+ isbot:
+ specifier: ^5.1.31
+ version: 5.1.31
+ react:
+ specifier: ^19.1.1
+ version: 19.1.1
+ react-dom:
+ specifier: ^19.1.1
+ version: 19.1.1(react@19.1.1)
+ react-router:
+ specifier: ^7.9.2
+ version: 7.9.2(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
+ devDependencies:
+ '@react-router/dev':
+ specifier: ^7.9.2
+ version: 7.9.2(@react-router/serve@7.9.2(react-router@7.9.2(react-dom@19.1.1(react@19.1.1))(react@19.1.1))(typescript@5.9.2))(@types/node@22.15.3)(@vitejs/plugin-rsc@0.4.31(react-dom@19.1.1(react@19.1.1))(react@19.1.1)(vite@7.1.7(@types/node@22.15.3)(jiti@2.5.1)(lightningcss@1.30.1)(tsx@4.19.2)(yaml@2.6.1)))(babel-plugin-macros@3.1.0)(jiti@2.5.1)(lightningcss@1.30.1)(react-router@7.9.2(react-dom@19.1.1(react@19.1.1))(react@19.1.1))(tsx@4.19.2)(typescript@5.9.2)(vite@7.1.7(@types/node@22.15.3)(jiti@2.5.1)(lightningcss@1.30.1)(tsx@4.19.2)(yaml@2.6.1))(wrangler@4.40.0)(yaml@2.6.1)
+ '@tailwindcss/vite':
+ specifier: ^4.1.13
+ version: 4.1.13(vite@7.1.7(@types/node@22.15.3)(jiti@2.5.1)(lightningcss@1.30.1)(tsx@4.19.2)(yaml@2.6.1))
+ '@types/bun':
+ specifier: ^1.3.1
+ version: 1.3.2(@types/react@19.1.13)
+ '@types/node':
+ specifier: ^22
+ version: 22.15.3
+ '@types/react':
+ specifier: ^19.1.13
+ version: 19.1.13
+ '@types/react-dom':
+ specifier: ^19.1.9
+ version: 19.1.9(@types/react@19.1.13)
+ tailwindcss:
+ specifier: ^4.1.13
+ version: 4.1.13
+ typescript:
+ specifier: ^5.9.2
+ version: 5.9.2
+ vite:
+ specifier: ^7.1.7
+ version: 7.1.7(@types/node@22.15.3)(jiti@2.5.1)(lightningcss@1.30.1)(tsx@4.19.2)(yaml@2.6.1)
+ vite-tsconfig-paths:
+ specifier: ^5.1.4
+ version: 5.1.4(typescript@5.9.2)(vite@7.1.7(@types/node@22.15.3)(jiti@2.5.1)(lightningcss@1.30.1)(tsx@4.19.2)(yaml@2.6.1))
+
default:
dependencies:
'@react-router/node':
@@ -248,7 +294,7 @@ importers:
version: 1.8.1
drizzle-orm:
specifier: ~0.36.3
- version: 0.36.3(@cloudflare/workers-types@4.20250429.0)(@opentelemetry/api@1.8.0)(@types/pg@8.11.14)(@types/react@19.1.13)(postgres@3.4.5)(react@19.1.1)
+ version: 0.36.3(@cloudflare/workers-types@4.20250429.0)(@opentelemetry/api@1.8.0)(@types/pg@8.11.14)(@types/react@19.1.13)(bun-types@1.3.2(@types/react@19.1.13))(postgres@3.4.5)(react@19.1.1)
express:
specifier: ^5.1.0
version: 5.1.0
@@ -2289,6 +2335,9 @@ packages:
'@types/body-parser@1.19.5':
resolution: {integrity: sha512-fB3Zu92ucau0iQ0JMCFQE7b/dv8Ot07NI3KaZIkIUNXq82k4eBAqUaneXfleGY9JWskeS9y+u0nXMyspcuQrCg==}
+ '@types/bun@1.3.2':
+ resolution: {integrity: sha512-t15P7k5UIgHKkxwnMNkJbWlh/617rkDGEdSsDbu+qNHTaz9SKf7aC8fiIlUdD5RPpH6GEkP0cK7WlvmrEBRtWg==}
+
'@types/compression@1.8.1':
resolution: {integrity: sha512-kCFuWS0ebDbmxs0AXYn6e2r2nrGAb5KwQhknjSPSPgJcGd8+HVSILlUyFhGqML2gk39HcG7D1ydW9/qpYkN00Q==}
@@ -2459,6 +2508,11 @@ packages:
buffer@6.0.3:
resolution: {integrity: sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==}
+ bun-types@1.3.2:
+ resolution: {integrity: sha512-i/Gln4tbzKNuxP70OWhJRZz1MRfvqExowP7U6JKoI8cntFrtxg7RJK3jvz7wQW54UuvNC8tbKHHri5fy74FVqg==}
+ peerDependencies:
+ '@types/react': ^19
+
bytes@3.1.2:
resolution: {integrity: sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==}
engines: {node: '>= 0.8'}
@@ -6092,6 +6146,12 @@ snapshots:
'@types/connect': 3.4.38
'@types/node': 22.15.3
+ '@types/bun@1.3.2(@types/react@19.1.13)':
+ dependencies:
+ bun-types: 1.3.2(@types/react@19.1.13)
+ transitivePeerDependencies:
+ - '@types/react'
+
'@types/compression@1.8.1':
dependencies:
'@types/express': 5.0.3
@@ -6374,6 +6434,11 @@ snapshots:
base64-js: 1.5.1
ieee754: 1.2.1
+ bun-types@1.3.2(@types/react@19.1.13):
+ dependencies:
+ '@types/node': 22.15.3
+ '@types/react': 19.1.13
+
bytes@3.1.2: {}
cac@6.7.14: {}
@@ -6541,12 +6606,13 @@ snapshots:
transitivePeerDependencies:
- supports-color
- drizzle-orm@0.36.3(@cloudflare/workers-types@4.20250429.0)(@opentelemetry/api@1.8.0)(@types/pg@8.11.14)(@types/react@19.1.13)(postgres@3.4.5)(react@19.1.1):
+ drizzle-orm@0.36.3(@cloudflare/workers-types@4.20250429.0)(@opentelemetry/api@1.8.0)(@types/pg@8.11.14)(@types/react@19.1.13)(bun-types@1.3.2(@types/react@19.1.13))(postgres@3.4.5)(react@19.1.1):
optionalDependencies:
'@cloudflare/workers-types': 4.20250429.0
'@opentelemetry/api': 1.8.0
'@types/pg': 8.11.14
'@types/react': 19.1.13
+ bun-types: 1.3.2(@types/react@19.1.13)
postgres: 3.4.5
react: 19.1.1
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index de00ace..e7ea995 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,5 +1,6 @@
packages:
- ".tests"
+ - "bun"
- "default"
- "javascript"
- "minimal"
From 3028315279a074d875aa8f2895a9a041ad85637b Mon Sep 17 00:00:00 2001
From: Javi Aguilar <122741+itsjavi@users.noreply.github.com>
Date: Sat, 8 Nov 2025 23:34:48 +0100
Subject: [PATCH 2/2] improve DIY deployment instructions
---
bun/README.md | 3 +++
1 file changed, 3 insertions(+)
diff --git a/bun/README.md b/bun/README.md
index b1cb0c8..a6753fa 100644
--- a/bun/README.md
+++ b/bun/README.md
@@ -72,11 +72,14 @@ Make sure to deploy the output of `bun run build`
```
├── package.json
├── bun.lock
+├── server.ts
├── build/
│ ├── client/ # Static assets
│ └── server/ # Server-side code
```
+Then, run `bun run server.ts build/server/index.js`
+
## Styling
This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever CSS framework you prefer.
+ 
+