Skip to content

Commit 4030c4e

Browse files
QuiiBzQuiiBz
authored
Improve Bun templates (#1278)
Follow-up to #1276 and #1277, improve both templates with better README, show the Bun version, add missing assets and more complete example for Express
1 parent 64d47b9 commit 4030c4e

File tree

8 files changed

+112
-15
lines changed

8 files changed

+112
-15
lines changed

‎framework-boilerplates/express-bun/README.md‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1+
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/examples/tree/main/framework-boilerplates/express-bun&template=express)
2+
3+
Live Example: https://example-express-bun.vercel.app/
4+
5+
Prerequisites:
6+
7+
- [Vercel CLI](https://vercel.com/docs/cli) installed globally
8+
19
To develop locally:
210

311
```
@@ -12,13 +20,13 @@ open http://localhost:3000
1220
To build locally:
1321

1422
```
15-
npm install
23+
bun install
1624
vc build
1725
```
1826

1927
To deploy:
2028

2129
```
22-
npm install
30+
bun install
2331
vc deploy
2432
```

‎framework-boilerplates/express-bun/components/about.htm‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<html>
2+
<head>
3+
<meta charset="utf-8"/>
4+
<title>Express on Vercel</title>
5+
<link rel="stylesheet" href="/style.css" />
6+
</head>
7+
<body>
8+
<div>
9+
<h1>About</h1>
10+
<p>This is a simple web app demonstrating how to use Express.js with Vercel. This app shows how to create different routes, upload data to a databse, and fetch data from a database.</p>
11+
</body>
12+
</html>

‎framework-boilerplates/express-bun/public/logo.png‎

8.77 KB
Loading

‎framework-boilerplates/express-bun/public/style.css‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
body {
2+
font-family: system-ui, sans-serif;
3+
margin: 2rem;
4+
line-height: 1.5;
5+
}
6+
nav a {
7+
margin-right: 1rem;
8+
}
9+

‎framework-boilerplates/express-bun/src/index.ts‎

Lines changed: 40 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,52 @@
11
import express from 'express'
2+
import path from 'path'
3+
import { fileURLToPath } from 'url'
4+
5+
const __filename = fileURLToPath(import.meta.url)
6+
const __dirname = path.dirname(__filename)
27

38
const app = express()
49

5-
const runtime = typeof globalThis.Bun !== 'undefined' ? 'bun' : 'node'
10+
// Home route - HTML
11+
app.get('/', (req, res) => {
12+
res.type('html').send(`
13+
<!doctype html>
14+
<html>
15+
<head>
16+
<meta charset="utf-8"/>
17+
<title>Express + Bun ${process.versions.bun} on Vercel</title>
18+
<link rel="stylesheet" href="/style.css" />
19+
</head>
20+
<body>
21+
<nav>
22+
<a href="/">Home</a>
23+
<a href="/about">About</a>
24+
<a href="/api-data">API Data</a>
25+
<a href="/healthz">Health</a>
26+
</nav>
27+
<h1>Welcome to Express + Bun ${process.versions.bun} on Vercel 🚀</h1>
28+
<p>This is a minimal example without a database or forms.</p>
29+
<img src="/logo.png" alt="Logo" width="120" />
30+
</body>
31+
</html>
32+
`)
33+
})
634

7-
app.get('/', (_req, res) => {
8-
res.send(`Hello from ${runtime}!`)
35+
app.get('/about', function (req, res) {
36+
res.sendFile(path.join(__dirname, '..', 'components', 'about.htm'))
937
})
1038

11-
app.get('/api/users/:id', (_req, res) => {
12-
res.json({ id: _req.params.id })
39+
// Example API endpoint - JSON
40+
app.get('/api-data', (req, res) => {
41+
res.json({
42+
message: 'Here is some sample API data',
43+
items: ['apple', 'banana', 'cherry'],
44+
})
1345
})
1446

15-
app.get('/api/posts/:postId/comments/:commentId', (_req, res) => {
16-
res.json({ postId: _req.params.postId, commentId: _req.params.commentId })
47+
// Health check
48+
app.get('/healthz', (req, res) => {
49+
res.status(200).json({ status: 'ok', timestamp: new Date().toISOString() })
1750
})
1851

1952
export default app

‎framework-boilerplates/hono-bun/.gitignore‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# dev
2+
.yarn/
3+
!.yarn/releases
4+
.vscode/*
5+
!.vscode/launch.json
6+
!.vscode/*.code-snippets
7+
.idea/workspace.xml
8+
.idea/usage.statistics.xml
9+
.idea/shelf
10+
11+
# deps
12+
node_modules/
13+
14+
# env
15+
.env
16+
.env.production
17+
18+
# logs
19+
logs/
20+
*.log
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*
24+
pnpm-debug.log*
25+
lerna-debug.log*
26+
27+
# misc
28+
.DS_Store
29+
.vercel

‎framework-boilerplates/hono-bun/README.md‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1+
[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/vercel/examples/tree/main/framework-boilerplates/hono-bun&template=hono)
2+
3+
Live Example: https://example-hono-bun.vercel.app/
4+
5+
Prerequisites:
6+
7+
- [Vercel CLI](https://vercel.com/docs/cli) installed globally
8+
19
To develop locally:
210

311
```
@@ -12,13 +20,13 @@ open http://localhost:3000
1220
To build locally:
1321

1422
```
15-
npm install
23+
bun install
1624
vc build
1725
```
1826

1927
To deploy:
2028

2129
```
22-
npm install
30+
bun install
2331
vc deploy
2432
```

‎framework-boilerplates/hono-bun/src/index.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,9 @@ import { Hono } from "hono";
22

33
const app = new Hono();
44

5-
const runtime = typeof globalThis.Bun !== "undefined" ? "bun" : "node";
6-
75
const welcomeStrings = [
8-
`Hello from ${runtime}!`,
9-
"To learn more about Hono on Vercel, visit https://vercel.com/docs/frameworks/backend/hono",
6+
`Hello Hono from Bun ${process.versions.bun}!`,
7+
"To learn more about Hono + Bun on Vercel, visit https://vercel.com/docs/frameworks/backend/hono",
108
];
119

1210
app.get("/", (c) => {

0 commit comments

Comments
 (0)