Skip to content

Commit b57e04b

Browse files
committed
TS boilerplate
1 parent 8fb8ae2 commit b57e04b

File tree

12 files changed

+1446
-704
lines changed

12 files changed

+1446
-704
lines changed

.devcontainer/devcontainer.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
{
44
"name": "Repo owner - all projects",
55
// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
6-
"image": "mcr.microsoft.com/devcontainers/typescript-node:0-18",
6+
"image": "mcr.microsoft.com/devcontainers/typescript-node:0-20",
77

88
// Features to add to the dev container. More info: https://containers.dev/features.
99
// "features": {},
@@ -12,7 +12,7 @@
1212
"forwardPorts": [7071],
1313

1414
// Use 'postCreateCommand' to run commands after the container is created.
15-
"postCreateCommand": "npm install -g azure-functions-core-tools@4.5611 --save-exact --unsafe-perm true",
15+
"postCreateCommand": "npm install -g azure-functions-core-tools@4.0.6610 --save-exact --unsafe-perm true",
1616
"features": {
1717
"ghcr.io/jsburckhardt/devcontainer-features/gitleaks:1": {},
1818
"ghcr.io/devcontainers/features/azure-cli:1": {}
+1-1
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
GET http://localhost:3000 HTTP/1.1
1+
GET http://localhost:3000/ HTTP/1.1

ts-boilerplate-common/http/post-data.http ts-boilerplate-common/http/post-api.http

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
POST http://localhost:3000/data HTTP/1.1
1+
POST http://localhost:3000/api HTTP/1.1
22
content-type: application/json
33

44
{

ts-boilerplate-common/package-lock.json

+731-672
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

ts-boilerplate-common/package.json

+8-4
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,22 @@
33
"version": "1.0.0",
44
"main": "index.js",
55
"scripts": {
6-
"start": "tsc && node dist/index.js"
6+
"clean": "rm -rf dist",
7+
"build": "tsc",
8+
"build:fe": "cp \"src/public\" \"./dist/public/\" -r",
9+
"start": "npm run clean && npm run build && npm run build:fe && node dist/index.js"
710
},
811
"author": "",
912
"license": "MIT",
1013
"description": "",
1114
"dependencies": {
12-
"express": "^4.21.1"
15+
"@fastify/cors": "^10.0.1",
16+
"@fastify/static": "^8.0.2",
17+
"fastify": "^5.1.0"
1318
},
1419
"devDependencies": {
15-
"@types/express": "^5.0.0",
1620
"@types/node": "^22.9.1",
17-
"ts-node": "^10.9.2",
21+
"prettier": "3.3.3",
1822
"typescript": "^5.6.3"
1923
}
2024
}

ts-boilerplate-common/readme.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# TypeScript Commonjs boilerplate
2+
3+
* Node.js v20 is required

ts-boilerplate-common/src/index.ts

+54-24
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,54 @@
1-
import express, { Request, Response } from 'express';
2-
3-
const app = express();
4-
const port = process.env.PORT || 3000;
5-
6-
// Middleware to parse JSON bodies
7-
app.use(express.json());
8-
9-
// Simple GET endpoint
10-
app.get('/', (req: Request, res: Response) => {
11-
res.send('Hello, world!');
12-
});
13-
14-
// Simple POST endpoint
15-
app.post('/data', (req: Request, res: Response) => {
16-
const data = req.body;
17-
console.log(data);
18-
res.json({ received: data });
19-
});
20-
21-
// Start the server
22-
app.listen(port, () => {
23-
console.log(`Server is running on port ${port}`);
24-
});
1+
import fastifyStatic from '@fastify/static'
2+
import Fastify, { FastifyInstance, FastifyReply, FastifyRequest } from 'fastify'
3+
import path from 'path'
4+
5+
const fastify = Fastify({
6+
logger: true
7+
})
8+
9+
const publicPath = path.join(__dirname, 'public')
10+
console.log('publicPath', publicPath)
11+
12+
// Register the fastify-static plugin
13+
fastify.register(fastifyStatic, {
14+
root: publicPath,
15+
prefix: '/public',
16+
})
17+
18+
// Register CORS plugin
19+
fastify.register(require('@fastify/cors'), {
20+
origin: '*', // Allow all origins
21+
})
22+
const routes = (fastify: FastifyInstance, _: any, done: () => void) => {
23+
24+
// JSON data
25+
fastify.post('/api', (request: FastifyRequest, reply: FastifyReply) => {
26+
console.log(`************ API post request received: ${JSON.stringify(request.body)}`)
27+
const data = request.body
28+
reply.code(200).send({ received: data })
29+
});
30+
31+
// root
32+
fastify.get('/', (_: FastifyRequest, reply: FastifyReply) => {
33+
console.log(`************ ROOT post request received`)
34+
reply.sendFile('index.html')
35+
});
36+
37+
done();
38+
}
39+
40+
fastify.register(routes);
41+
42+
/**
43+
* Run the server!
44+
*/
45+
const start = async () => {
46+
try {
47+
await fastify.listen({ port: 3000, host: '0.0.0.0' })
48+
console.log(`server listening on 3000`)
49+
} catch (err) {
50+
fastify.log.error(err)
51+
process.exit(1)
52+
}
53+
}
54+
start()
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<!doctype html>
2+
<html lang="en" class="h-100">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<meta name="description" content="">
7+
<title>TypeScript ESM boilerplate sample</title>
8+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
9+
integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
10+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css"
11+
integrity="sha256-4RctOgogjPAdwGbwq+rxfwAmSpZhWaafcZR9btzUk18=" crossorigin="anonymous">
12+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/cosmo/bootstrap.min.css"
13+
integrity="sha256-axRDISYf7Hht1KhcMnfDV2nq7hD/8Q9Rxa0YlW/o3NU=" crossorigin="anonymous">
14+
<link href="/public/styles.css" rel="stylesheet" type="text/css">
15+
</head>
16+
<body>
17+
<main class="h-100 mh-100 d-flex flex-column overflow-hidden justify-content-start">
18+
19+
<div id="messages" class="px-4 pb-4 pt-2 flex-grow-1 overflow-y-auto overflow-x-hidden align-items-stretch">
20+
21+
TypeScript ESM boilerplate sample
22+
23+
</div>
24+
<div id="api-data" class="px-4 pb-4 pt-2 flex-grow-1 overflow-y-auto overflow-x-hidden align-items-stretch">
25+
<!-- API data will be displayed here -->
26+
</div>
27+
</main>
28+
29+
<script>
30+
// Function to fetch data from /api and display it
31+
async function fetchData() {
32+
try {
33+
console.log('Fetching data...'); // Debugging log
34+
const response = await fetch('/api', {
35+
method: 'POST',
36+
headers: {
37+
'Content-Type': 'application/json'
38+
},
39+
body: JSON.stringify({ key: 'value' }) // Replace with actual data to send
40+
});
41+
if (!response.ok) {
42+
throw new Error('Network response was not ok');
43+
}
44+
const data = await response.json();
45+
const prettyJson = JSON.stringify(data, null, 2);
46+
document.getElementById('api-data').innerText = prettyJson;
47+
} catch (error) {
48+
console.error('There was a problem with the fetch operation:', error);
49+
}
50+
}
51+
52+
// Call fetchData when the page loads
53+
window.onload = fetchData;
54+
</script>
55+
</body>
56+
</html>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
* {
2+
box-sizing: border-box;
3+
}
4+
5+
html, body {
6+
height: 100%;
7+
}
8+
9+
#messages .toast-container {
10+
margin-bottom: 12px;
11+
}
12+
13+
.background-user {
14+
background-color: #2372cc;
15+
}
16+
17+
.background-assistant {
18+
background-color: #2c8310;
19+
}

0 commit comments

Comments
 (0)