Skip to content

Commit bb82367

Browse files
michalkvasnicakmichalkvasnicak
committed
feat: hono, express, remix templates
1 parent cf263b1 commit bb82367

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

78 files changed

+5819
-476
lines changed

‎examples/framesjs-starter/package.json

+2-4
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,7 @@
88
"dev:monorepo": "next dev",
99
"build": "next build",
1010
"start": "next start",
11-
"lint": "next lint",
12-
"update-debugger": "npx degit github:framesjs/frames.js/examples/framesjs-starter/app/debug#main app/debug --force",
13-
"update-framesjs": "yarn upgrade frames.js@latest && yarn run update-debugger"
11+
"lint": "next lint"
1412
},
1513
"dependencies": {
1614
"@farcaster/core": "^0.14.3",
@@ -43,4 +41,4 @@
4341
"tailwindcss": "^3.3.0",
4442
"typescript": "^5.3.3"
4543
}
46-
}
44+
}

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "framesjs-monorepo",
33
"private": true,
44
"scripts": {
5-
"build": "turbo build && node ./.scripts/prepare-create-frames.js",
5+
"build": "turbo build --filter=!./templates/* && node ./.scripts/prepare-create-frames.js",
66
"dev": "FJS_MONOREPO=true turbo dev --filter=framesjs-starter... --filter=debugger...",
77
"dev:custom-redirects": "turbo dev --filter=custom-redirects...",
88
"dev:utils-starter": "turbo dev --filter=utils-starter...",

‎templates/express/.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎templates/express/README.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Welcome to Express.js + Frames.js
2+
3+
📖 See the [Express.js docs](https://expressjs.com) and [Frames.js docs](https://framesjs.org) for details on supported features.
4+
5+
## Development
6+
7+
Run the Frames.js debugger and Vite dev server:
8+
9+
```shellscript
10+
npm run dev
11+
```

‎templates/express/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + Frames.js + Express.js + TS</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/index.tsx"></script>
12+
</body>
13+
</html>

‎templates/express/package.json

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"name": "template-express",
3+
"version": "0.0.0",
4+
"type": "module",
5+
"private": true,
6+
"dependencies": {
7+
"compression": "^1.7.4",
8+
"express": "^4.19.1",
9+
"frames.js": "^0.9.6",
10+
"react": "^18.2.0",
11+
"sirv": "^2.0.4"
12+
},
13+
"devDependencies": {
14+
"@frames.js/debugger": "^0.1.9",
15+
"@types/express": "^4.17.21",
16+
"@types/node": "^18.17.0",
17+
"@types/react": "^18.2.45",
18+
"@vitejs/plugin-react": "^4.2.1",
19+
"concurrently": "^8.2.2",
20+
"cross-env": "^7.0.3",
21+
"typescript": "^5.1.6",
22+
"vite": "^5.1.0",
23+
"vite-tsconfig-paths": "^4.2.1"
24+
},
25+
"engines": {
26+
"node": ">=18.17.0"
27+
},
28+
"scripts": {
29+
"dev": "concurrently --kill-others \"node server\" \"frames --url http://localhost:5173\"",
30+
"build": "npm run build:client && npm run build:server",
31+
"build:client": "vite build --ssrManifest --outDir dist/client",
32+
"build:server": "vite build --ssr src/entry-server.tsx --outDir dist/server",
33+
"preview": "cross-env NODE_ENV=production node server"
34+
}
35+
}

‎templates/express/server.js

+57
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import express from "express";
2+
3+
// Constants
4+
const isProduction = process.env.NODE_ENV === "production";
5+
const port = process.env.PORT || 5173;
6+
const base = process.env.BASE || "/";
7+
8+
// Create http server
9+
const app = express();
10+
11+
// Add Vite or respective production middlewares
12+
let vite;
13+
if (!isProduction) {
14+
const { createServer } = await import("vite");
15+
vite = await createServer({
16+
server: { middlewareMode: true },
17+
appType: "custom",
18+
base,
19+
});
20+
app.use(vite.middlewares);
21+
} else {
22+
const compression = (await import("compression")).default;
23+
const sirv = (await import("sirv")).default;
24+
app.use(compression());
25+
app.use(base, sirv("./dist/client", { extensions: [] }));
26+
}
27+
28+
// Serve HTML
29+
app.use("*", async (req, res) => {
30+
try {
31+
const url = req.originalUrl.replace(base, "");
32+
33+
/**
34+
* @type {import('express').Handler}
35+
*/
36+
let handleRequest;
37+
if (!isProduction) {
38+
// Always read fresh template in development
39+
handleRequest = (await vite.ssrLoadModule("/src/entry-server.tsx"))
40+
.handleRequest;
41+
} else {
42+
handleRequest = (await import("./dist/server/entry-server.js"))
43+
.handleRequest;
44+
}
45+
46+
handleRequest(req, res);
47+
} catch (e) {
48+
vite?.ssrFixStacktrace(e);
49+
console.log(e.stack);
50+
res.status(500).end(e.stack);
51+
}
52+
});
53+
54+
// Start http server
55+
app.listen(port, () => {
56+
console.log(`Server started at http://localhost:${port}`);
57+
});

‎templates/express/src/entry-server.tsx

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import { farcasterHubContext } from "frames.js/middleware";
2+
import { createFrames, Button } from 'frames.js/express';
3+
4+
const frames = createFrames({
5+
middleware: [
6+
farcasterHubContext({
7+
// remove if you aren't using @frames.js/debugger or you just don't want to use the debugger hub
8+
...(process.env.NODE_ENV === "production"
9+
? {}
10+
: {
11+
hubHttpUrl: "http://localhost:3010/hub",
12+
}),
13+
}),
14+
],
15+
});
16+
17+
export const handleRequest = frames(async ctx => {
18+
return {
19+
image: ctx.message ? (
20+
<div
21+
style={{
22+
display: "flex",
23+
flexDirection: "column",
24+
}}
25+
>
26+
GM, {ctx.message.requesterUserData?.displayName}! Your FID is{" "}
27+
{ctx.message.requesterFid}
28+
{", "}
29+
{ctx.message.requesterFid < 20_000
30+
? "you're OG!"
31+
: "welcome to the Farcaster!"}
32+
</div>
33+
) : (
34+
<div
35+
style={{
36+
display: "flex",
37+
flexDirection: "column",
38+
}}
39+
>
40+
Say GM
41+
</div>
42+
),
43+
buttons: !ctx.url.searchParams.has("saidGm")
44+
? [
45+
<Button action="post" key="1" target={{ query: { saidGm: true } }}>
46+
Say GM
47+
</Button>,
48+
]
49+
: [],
50+
};
51+
});

‎templates/express/src/index.tsx

Whitespace-only changes.

‎templates/express/src/vite-env.d.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/// <reference types="vite/client" />

‎templates/express/tsconfig.json

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"compilerOptions": {
3+
"target": "ES2020",
4+
"useDefineForClassFields": true,
5+
"lib": ["ES2020", "DOM", "DOM.Iterable"],
6+
"module": "ESNext",
7+
"skipLibCheck": true,
8+
9+
/* Bundler mode */
10+
"moduleResolution": "Bundler",
11+
"allowImportingTsExtensions": true,
12+
"resolveJsonModule": true,
13+
"isolatedModules": true,
14+
"noEmit": true,
15+
"jsx": "react-jsx",
16+
17+
/* Linting */
18+
"strict": true,
19+
"noUnusedLocals": true,
20+
"noUnusedParameters": true,
21+
"noFallthroughCasesInSwitch": true
22+
},
23+
"include": ["src"],
24+
"references": [{ "path": "./tsconfig.node.json" }]
25+
}

‎templates/express/tsconfig.node.json

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"skipLibCheck": true,
5+
"module": "ESNext",
6+
"moduleResolution": "Bundler",
7+
"allowSyntheticDefaultImports": true,
8+
"jsx": "preserve"
9+
},
10+
"include": ["vite.config.ts"]
11+
}

‎templates/express/vite.config.ts

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { defineConfig } from "vite";
2+
import react from "@vitejs/plugin-react";
3+
4+
// https://vitejs.dev/config/
5+
export default defineConfig({
6+
plugins: [react()],
7+
});

‎templates/hono/.gitignore

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎templates/hono/README.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Welcome to Hono + Frames.js
2+
3+
📖 See the [Hono docs](https://hono.dev) and [Frames.js docs](https://framesjs.org) for details on supported features.
4+
5+
## Development
6+
7+
Run the Frames.js debugger and Vite dev server:
8+
9+
```shellscript
10+
npm run dev
11+
```

‎templates/hono/index.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + Frames.js + Hono + TS</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/index.tsx"></script>
12+
</body>
13+
</html>

‎templates/hono/package.json

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "template-hono",
3+
"version": "0.0.0",
4+
"type": "module",
5+
"private": true,
6+
"dependencies": {
7+
"@hono/node-server": "^1.9.0",
8+
"hono": "^4.1.4",
9+
"frames.js": "^0.9.6",
10+
"react": "^18.2.0"
11+
},
12+
"devDependencies": {
13+
"@frames.js/debugger": "^0.1.9",
14+
"@hono/vite-dev-server": "^0.10.0",
15+
"@types/node": "^18.17.0",
16+
"@types/react": "^18.2.45",
17+
"@vitejs/plugin-react": "^4.2.1",
18+
"concurrently": "^8.2.2",
19+
"cross-env": "^7.0.3",
20+
"typescript": "^5.1.6",
21+
"vite": "^5.1.0",
22+
"vite-tsconfig-paths": "^4.2.1"
23+
},
24+
"engines": {
25+
"node": ">=18.17.0"
26+
},
27+
"scripts": {
28+
"dev": "concurrently --kill-others \"vite\" \"frames --url http://localhost:5173\"",
29+
"build": "npm run build:client && npm run build:server",
30+
"build:client": "vite build --ssrManifest --outDir dist/client",
31+
"build:server": "vite build --ssr src/server.tsx --outDir dist/server",
32+
"preview": "cross-env-shell NODE_ENV=production \"npm run build && node dist/server/server.js\""
33+
}
34+
}

‎templates/hono/src/index.tsx

Whitespace-only changes.

0 commit comments

Comments
 (0)