reroute-js 0.2.1 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (188) hide show
  1. package/_/README.md +59 -0
  2. package/_/basic/package.json +23 -0
  3. package/_/basic/src/client/App.tsx +10 -0
  4. package/_/basic/src/client/components/Counter.tsx +15 -0
  5. package/_/basic/src/client/index.html +12 -0
  6. package/_/basic/src/client/index.tsx +5 -0
  7. package/_/basic/src/client/routes/[404].tsx +18 -0
  8. package/_/basic/src/client/routes/about.tsx +25 -0
  9. package/_/basic/src/client/routes/index.tsx +57 -0
  10. package/_/basic/src/index.ts +20 -0
  11. package/_/basic/tsconfig.json +26 -0
  12. package/_/blog/package.json +23 -0
  13. package/_/blog/src/client/App.tsx +10 -0
  14. package/_/blog/src/client/components/Counter.tsx +14 -0
  15. package/_/blog/src/client/components/RecentPosts.tsx +90 -0
  16. package/_/blog/src/client/index.html +13 -0
  17. package/_/blog/src/client/index.tsx +5 -0
  18. package/_/blog/src/client/routes/[404].tsx +21 -0
  19. package/_/blog/src/client/routes/about.tsx +31 -0
  20. package/_/blog/src/client/routes/blog/[404].tsx +21 -0
  21. package/_/blog/src/client/routes/blog/[layout].tsx +84 -0
  22. package/_/blog/src/client/routes/blog/[slug].tsx +11 -0
  23. package/_/blog/src/client/routes/blog/content/1-hello-world.tsx +27 -0
  24. package/_/blog/src/client/routes/blog/content/2-what-is-reroute.tsx +31 -0
  25. package/_/blog/src/client/routes/blog/index.tsx +70 -0
  26. package/_/blog/src/client/routes/index.tsx +63 -0
  27. package/_/blog/src/index.ts +20 -0
  28. package/_/blog/tsconfig.json +26 -0
  29. package/_/store/package.json +25 -0
  30. package/_/store/src/client/App.tsx +17 -0
  31. package/_/store/src/client/components/Header.tsx +40 -0
  32. package/_/store/src/client/components/ProductCard.tsx +51 -0
  33. package/_/store/src/client/index.html +17 -0
  34. package/_/store/src/client/index.tsx +7 -0
  35. package/_/store/src/client/lib/api.ts +153 -0
  36. package/_/store/src/client/routes/[404].tsx +63 -0
  37. package/_/store/src/client/routes/categories/[category].tsx +223 -0
  38. package/_/store/src/client/routes/categories/index.tsx +187 -0
  39. package/_/store/src/client/routes/index.tsx +126 -0
  40. package/_/store/src/client/routes/products/[id].tsx +233 -0
  41. package/_/store/src/client/routes/products/index.tsx +261 -0
  42. package/_/store/src/client/theme.css +306 -0
  43. package/_/store/src/index.ts +19 -0
  44. package/_/store/tsconfig.json +26 -0
  45. package/{packages/cli/bin.ts → cli/bin.d.ts} +1 -1
  46. package/cli/bin.d.ts.map +1 -0
  47. package/cli/bin.js +878 -0
  48. package/cli/bin.js.map +15 -0
  49. package/cli/index.d.ts +2 -0
  50. package/cli/index.d.ts.map +1 -0
  51. package/cli/index.js +147 -0
  52. package/cli/index.js.map +10 -0
  53. package/cli/src/cli.d.ts +8 -0
  54. package/cli/src/cli.d.ts.map +1 -0
  55. package/cli/src/commands/build.d.ts +8 -0
  56. package/cli/src/commands/build.d.ts.map +1 -0
  57. package/cli/src/commands/dev.d.ts +8 -0
  58. package/cli/src/commands/dev.d.ts.map +1 -0
  59. package/cli/src/commands/gen.d.ts +3 -0
  60. package/cli/src/commands/gen.d.ts.map +1 -0
  61. package/cli/src/commands/init.d.ts +8 -0
  62. package/cli/src/commands/init.d.ts.map +1 -0
  63. package/cli/src/libs/index.d.ts +2 -0
  64. package/cli/src/libs/index.d.ts.map +1 -0
  65. package/cli/src/libs/tailwind.d.ts +45 -0
  66. package/cli/src/libs/tailwind.d.ts.map +1 -0
  67. package/core/index.d.ts +2 -0
  68. package/core/index.d.ts.map +1 -0
  69. package/core/index.js +1117 -0
  70. package/core/index.js.map +25 -0
  71. package/core/src/bundler/hash.d.ts +2 -0
  72. package/core/src/bundler/hash.d.ts.map +1 -0
  73. package/core/src/bundler/index.d.ts +3 -0
  74. package/core/src/bundler/index.d.ts.map +1 -0
  75. package/core/src/bundler/transpile.d.ts +4 -0
  76. package/core/src/bundler/transpile.d.ts.map +1 -0
  77. package/core/src/content/discovery.d.ts +5 -0
  78. package/core/src/content/discovery.d.ts.map +1 -0
  79. package/core/src/content/index.d.ts +4 -0
  80. package/core/src/content/index.d.ts.map +1 -0
  81. package/core/src/content/metadata.d.ts +9 -0
  82. package/core/src/content/metadata.d.ts.map +1 -0
  83. package/core/src/content/registry.d.ts +2 -0
  84. package/core/src/content/registry.d.ts.map +1 -0
  85. package/core/src/index.d.ts +7 -0
  86. package/core/src/index.d.ts.map +1 -0
  87. package/core/src/ssr/data.d.ts +9 -0
  88. package/core/src/ssr/data.d.ts.map +1 -0
  89. package/core/src/ssr/index.d.ts +4 -0
  90. package/core/src/ssr/index.d.ts.map +1 -0
  91. package/core/src/ssr/modules.d.ts +8 -0
  92. package/core/src/ssr/modules.d.ts.map +1 -0
  93. package/core/src/ssr/render.d.ts +20 -0
  94. package/core/src/ssr/render.d.ts.map +1 -0
  95. package/core/src/ssr/seed.d.ts +2 -0
  96. package/core/src/ssr/seed.d.ts.map +1 -0
  97. package/core/src/template/html.d.ts +4 -0
  98. package/core/src/template/html.d.ts.map +1 -0
  99. package/core/src/template/index.d.ts +2 -0
  100. package/core/src/template/index.d.ts.map +1 -0
  101. package/core/src/types.d.ts +50 -0
  102. package/core/src/types.d.ts.map +1 -0
  103. package/core/src/utils/cache.d.ts +12 -0
  104. package/core/src/utils/cache.d.ts.map +1 -0
  105. package/core/src/utils/compression.d.ts +5 -0
  106. package/core/src/utils/compression.d.ts.map +1 -0
  107. package/core/src/utils/index.d.ts +5 -0
  108. package/core/src/utils/index.d.ts.map +1 -0
  109. package/core/src/utils/mime.d.ts +3 -0
  110. package/core/src/utils/mime.d.ts.map +1 -0
  111. package/core/src/utils/path.d.ts +6 -0
  112. package/core/src/utils/path.d.ts.map +1 -0
  113. package/elysia/index.d.ts +2 -0
  114. package/elysia/index.d.ts.map +1 -0
  115. package/elysia/index.js +1780 -0
  116. package/elysia/index.js.map +32 -0
  117. package/elysia/src/index.d.ts +3 -0
  118. package/elysia/src/index.d.ts.map +1 -0
  119. package/elysia/src/plugin.d.ts +32 -0
  120. package/elysia/src/plugin.d.ts.map +1 -0
  121. package/elysia/src/routes/artifacts.d.ts +3 -0
  122. package/elysia/src/routes/artifacts.d.ts.map +1 -0
  123. package/elysia/src/routes/content.d.ts +3 -0
  124. package/elysia/src/routes/content.d.ts.map +1 -0
  125. package/elysia/src/routes/dev.d.ts +7 -0
  126. package/elysia/src/routes/dev.d.ts.map +1 -0
  127. package/elysia/src/routes/ssr.d.ts +21 -0
  128. package/elysia/src/routes/ssr.d.ts.map +1 -0
  129. package/elysia/src/routes/static.d.ts +19 -0
  130. package/elysia/src/routes/static.d.ts.map +1 -0
  131. package/elysia/src/types.d.ts +31 -0
  132. package/elysia/src/types.d.ts.map +1 -0
  133. package/elysia/src/utils/http.d.ts +5 -0
  134. package/elysia/src/utils/http.d.ts.map +1 -0
  135. package/package.json +3 -3
  136. package/react/index.d.ts +2 -0
  137. package/react/index.d.ts.map +1 -0
  138. package/react/index.js +1152 -0
  139. package/react/index.js.map +23 -0
  140. package/react/src/components/ContentRoute.d.ts +13 -0
  141. package/react/src/components/ContentRoute.d.ts.map +1 -0
  142. package/react/src/components/Link.d.ts +8 -0
  143. package/react/src/components/Link.d.ts.map +1 -0
  144. package/react/src/components/Outlet.d.ts +7 -0
  145. package/react/src/components/Outlet.d.ts.map +1 -0
  146. package/react/src/components/index.d.ts +4 -0
  147. package/react/src/components/index.d.ts.map +1 -0
  148. package/react/src/hooks/index.d.ts +7 -0
  149. package/react/src/hooks/index.d.ts.map +1 -0
  150. package/react/src/hooks/useContent.d.ts +26 -0
  151. package/react/src/hooks/useContent.d.ts.map +1 -0
  152. package/react/src/hooks/useData.d.ts +10 -0
  153. package/react/src/hooks/useData.d.ts.map +1 -0
  154. package/react/src/hooks/useNavigate.d.ts +6 -0
  155. package/react/src/hooks/useNavigate.d.ts.map +1 -0
  156. package/react/src/hooks/useParams.d.ts +6 -0
  157. package/react/src/hooks/useParams.d.ts.map +1 -0
  158. package/react/src/hooks/useRouter.d.ts +7 -0
  159. package/react/src/hooks/useRouter.d.ts.map +1 -0
  160. package/react/src/hooks/useSearchParams.d.ts +6 -0
  161. package/react/src/hooks/useSearchParams.d.ts.map +1 -0
  162. package/react/src/index.d.ts +6 -0
  163. package/react/src/index.d.ts.map +1 -0
  164. package/react/src/providers/ContentProvider.d.ts +35 -0
  165. package/react/src/providers/ContentProvider.d.ts.map +1 -0
  166. package/react/src/providers/RerouteProvider.d.ts +25 -0
  167. package/react/src/providers/RerouteProvider.d.ts.map +1 -0
  168. package/react/src/providers/RouterProvider.d.ts +23 -0
  169. package/react/src/providers/RouterProvider.d.ts.map +1 -0
  170. package/react/src/providers/index.d.ts +4 -0
  171. package/react/src/providers/index.d.ts.map +1 -0
  172. package/react/src/types/any.d.ts +3 -0
  173. package/react/src/types/any.d.ts.map +1 -0
  174. package/react/src/types/index.d.ts +3 -0
  175. package/react/src/types/index.d.ts.map +1 -0
  176. package/react/src/types/router.d.ts +32 -0
  177. package/react/src/types/router.d.ts.map +1 -0
  178. package/react/src/utils/content.d.ts +8 -0
  179. package/react/src/utils/content.d.ts.map +1 -0
  180. package/react/src/utils/head.d.ts +6 -0
  181. package/react/src/utils/head.d.ts.map +1 -0
  182. package/react/src/utils/index.d.ts +3 -0
  183. package/react/src/utils/index.d.ts.map +1 -0
  184. package/CHANGELOG.md +0 -23
  185. package/packages/cli/README.md +0 -264
  186. package/packages/core/README.md +0 -90
  187. package/packages/elysia/README.md +0 -250
  188. package/packages/react/README.md +0 -3
package/_/README.md ADDED
@@ -0,0 +1,59 @@
1
+ # Reroute CLI Templates
2
+
3
+ This directory contains the scaffolding templates used by the `reroute init` command.
4
+
5
+ ## Structure
6
+
7
+ Each subdirectory represents a template that users can choose from:
8
+
9
+ - `basic/` - Minimal Reroute application with basic routing
10
+ - `blog/` - Full-featured blog with content collections and layouts
11
+
12
+ ## How It Works
13
+
14
+ When a user runs `reroute init my-app --template blog`, the CLI:
15
+
16
+ 1. Copies all files from the `blog/` directory to the new project directory
17
+ 2. Replaces template variables (e.g., `{{PROJECT_NAME}}`) with actual values
18
+ 3. Runs `bun install` to install dependencies
19
+
20
+ ## Template Variables
21
+
22
+ Templates can use the following variables that will be replaced during scaffolding:
23
+
24
+ - `{{PROJECT_NAME}}` - The name of the project being created
25
+
26
+ ## Adding a New Template
27
+
28
+ To add a new template:
29
+
30
+ 1. Create a new directory (e.g., `docs/`)
31
+ 2. Add all necessary files with the complete project structure
32
+ 3. Use `{{PROJECT_NAME}}` where dynamic replacement is needed
33
+ 4. Update `init.ts` to include the new template in the template type union
34
+ 5. Update the CLI README to document the new template
35
+
36
+ ## File Organization
37
+
38
+ Templates should follow the standard Reroute project structure:
39
+
40
+ ```
41
+ template-name/
42
+ ├── package.json # Use {{PROJECT_NAME}} for the name field
43
+ ├── .gitignore
44
+ └── src/
45
+ ├── index.ts # Server entry point
46
+ └── client/
47
+ ├── App.tsx
48
+ ├── index.tsx
49
+ ├── index.html # Use {{PROJECT_NAME}} in the title
50
+ ├── routes/
51
+ └── components/
52
+ ```
53
+
54
+ ## Notes
55
+
56
+ - TypeScript errors in template files are expected (e.g., missing imports) since they're isolated
57
+ - These errors will resolve once the template is copied to an actual project
58
+ - Keep templates minimal but functional - users can customize from there
59
+ - Ensure templates follow the project's code style (Biome)
@@ -0,0 +1,23 @@
1
+ {
2
+ "name": "{{PROJECT_NAME}}",
3
+ "description": "A Reroute application",
4
+ "version": "0.0.0",
5
+ "scripts": {
6
+ "start": "reroute gen && bun src/index.ts",
7
+ "dev": "reroute gen --watch & bun --watch src/index.ts",
8
+ "build": "reroute gen && bun build src/index.ts --target bun --compile --outfile ./dist/app"
9
+ },
10
+ "private": true,
11
+ "dependencies": {
12
+ "reroute-js": "latest",
13
+ "elysia": "^1.4.13",
14
+ "react": "^19.2.0",
15
+ "react-dom": "^19.2.0"
16
+ },
17
+ "devDependencies": {
18
+ "@types/bun": "latest",
19
+ "@types/react": "^19.2.2",
20
+ "@types/react-dom": "^19.2.2",
21
+ "typescript": "^5"
22
+ }
23
+ }
@@ -0,0 +1,10 @@
1
+ import { RerouteProvider } from 'reroute-js/react';
2
+ import { artifacts } from '../../.reroute';
3
+
4
+ interface AppProps {
5
+ pathname?: string;
6
+ }
7
+
8
+ export default function App({ pathname }: AppProps = {}) {
9
+ return <RerouteProvider from={{ pathname, ...artifacts }} />;
10
+ }
@@ -0,0 +1,15 @@
1
+ import { useState } from 'react';
2
+
3
+ export default function Counter() {
4
+ const [count, setCount] = useState(0);
5
+ const increase = () => setCount((c) => c + 1);
6
+
7
+ return (
8
+ <section>
9
+ <h2>Current count: {count}</h2>
10
+ <button type='button' onClick={increase}>
11
+ Increase
12
+ </button>
13
+ </section>
14
+ );
15
+ }
@@ -0,0 +1,12 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>{{PROJECT_NAME}}</title>
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ </head>
8
+ <body>
9
+ <div id="root"></div>
10
+ <script type="module" src="./index.tsx"></script>
11
+ </body>
12
+ </html>
@@ -0,0 +1,5 @@
1
+ import { hydrateRoot } from 'react-dom/client';
2
+ import App from './App';
3
+
4
+ // biome-ignore lint/style/noNonNullAssertion: root element required
5
+ hydrateRoot(document.getElementById('root')!, <App />);
@@ -0,0 +1,18 @@
1
+ export default function NotFound() {
2
+ return (
3
+ <div
4
+ style={{
5
+ padding: '2rem',
6
+ maxWidth: '800px',
7
+ margin: '0 auto',
8
+ textAlign: 'center',
9
+ }}
10
+ >
11
+ <h1>404 - Page Not Found</h1>
12
+ <p>The page you're looking for doesn't exist.</p>
13
+ <nav style={{ marginTop: '2rem' }}>
14
+ <a href='/'>← Back to Home</a>
15
+ </nav>
16
+ </div>
17
+ );
18
+ }
@@ -0,0 +1,25 @@
1
+ const meta = {
2
+ title: 'About',
3
+ description: 'Learn more about our application',
4
+ };
5
+
6
+ function About() {
7
+ return (
8
+ <div style={{ padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
9
+ <h1>About</h1>
10
+ <p>Welcome to your Reroute application!</p>
11
+ <p>
12
+ This page demonstrates a simple static route that maps from{' '}
13
+ <code>routes/about.tsx</code> to <code>/about</code>.
14
+ </p>
15
+ <nav style={{ marginTop: '2rem' }}>
16
+ <a href='/' style={{ marginRight: '1rem' }}>
17
+ ← Back to Home
18
+ </a>
19
+ </nav>
20
+ </div>
21
+ );
22
+ }
23
+
24
+ export default About;
25
+ export { meta };
@@ -0,0 +1,57 @@
1
+ import { Link } from 'reroute-js/react';
2
+ import Counter from '../components/Counter';
3
+
4
+ export default function HomePage() {
5
+ return (
6
+ <main style={{ padding: '2rem', maxWidth: '1200px', margin: '0 auto' }}>
7
+ <h1>🏠 Welcome to Reroute!</h1>
8
+ <p>This is your new Reroute application.</p>
9
+
10
+ <section style={{ marginTop: '2rem' }}>
11
+ <h2>Navigation</h2>
12
+ <nav
13
+ style={{
14
+ display: 'flex',
15
+ gap: '1rem',
16
+ flexDirection: 'column',
17
+ maxWidth: '300px',
18
+ }}
19
+ >
20
+ <Link
21
+ to='/about'
22
+ style={{
23
+ padding: '0.5rem 1rem',
24
+ background: '#eee',
25
+ textDecoration: 'none',
26
+ borderRadius: '4px',
27
+ }}
28
+ >
29
+ About
30
+ </Link>
31
+ </nav>
32
+ </section>
33
+
34
+ <section
35
+ style={{
36
+ marginTop: '2rem',
37
+ padding: '1rem',
38
+ background: '#f5f5f5',
39
+ borderRadius: '8px',
40
+ }}
41
+ >
42
+ <h3>✨ Features</h3>
43
+ <ul>
44
+ <li>File-based routing</li>
45
+ <li>Client-side navigation (SPA)</li>
46
+ <li>Server-side rendering (SSR)</li>
47
+ <li>Type-safe route params</li>
48
+ <li>Automatic route generation</li>
49
+ </ul>
50
+ </section>
51
+
52
+ <section>
53
+ <Counter />
54
+ </section>
55
+ </main>
56
+ );
57
+ }
@@ -0,0 +1,20 @@
1
+ import { Elysia } from 'elysia';
2
+ import { createElement } from 'react';
3
+ import { reroute } from 'reroute-js/elysia';
4
+ import App from './client/App';
5
+
6
+ const IS_PRODUCTION = Bun.env.NODE_ENV === 'production';
7
+
8
+ const app = new Elysia()
9
+ .use(
10
+ reroute({
11
+ app: createElement(App),
12
+ minify: IS_PRODUCTION,
13
+ }),
14
+ )
15
+ .get('/api/message', () => ({ message: 'Hello from server' }))
16
+ .listen(Number(Bun.env.PORT || '3000'));
17
+
18
+ console.log(
19
+ `🦊 Reroute is running at ${app.server?.hostname}:${app.server?.port}`,
20
+ );
@@ -0,0 +1,26 @@
1
+ {
2
+ "compilerOptions": {
3
+ "target": "ES2020",
4
+ "useDefineForClassFields": true,
5
+ "lib": ["ES2020", "DOM", "DOM.Iterable"],
6
+ "module": "ESNext",
7
+ "skipLibCheck": true,
8
+ "moduleResolution": "bundler",
9
+ "isolatedModules": true,
10
+ "baseUrl": ".",
11
+ "rootDir": ".",
12
+ "declaration": true,
13
+ "declarationMap": true,
14
+ "outDir": "dist/types",
15
+ "emitDeclarationOnly": true,
16
+ "strict": true,
17
+ "noUnusedLocals": true,
18
+ "noUnusedParameters": true,
19
+ "noFallthroughCasesInSwitch": true,
20
+ "jsx": "react-jsx",
21
+ "types": ["bun", "node"],
22
+ "paths": {}
23
+ },
24
+ "include": ["packages/**/*.ts", "packages/**/*.tsx", "test/**/*.d.ts"],
25
+ "exclude": ["node_modules", "dist", "test"]
26
+ }
@@ -0,0 +1,23 @@
1
+ {
2
+ "name": "{{PROJECT_NAME}}",
3
+ "description": "A Reroute application",
4
+ "version": "0.0.0",
5
+ "scripts": {
6
+ "start": "reroute gen && bun src/index.ts",
7
+ "dev": "reroute gen --watch & bun --watch src/index.ts",
8
+ "build": "reroute gen && bun build src/index.ts --target bun --compile --outfile ./dist/app"
9
+ },
10
+ "private": true,
11
+ "dependencies": {
12
+ "reroute-js": "latest",
13
+ "elysia": "^1.4.12",
14
+ "react": "^19.2.0",
15
+ "react-dom": "^19.2.0"
16
+ },
17
+ "devDependencies": {
18
+ "@types/bun": "latest",
19
+ "@types/react": "^19.2.2",
20
+ "@types/react-dom": "^19.2.2",
21
+ "typescript": "^5"
22
+ }
23
+ }
@@ -0,0 +1,10 @@
1
+ import { RerouteProvider } from 'reroute-js/react';
2
+ import { artifacts } from '../../.reroute';
3
+
4
+ interface AppProps {
5
+ pathname?: string;
6
+ }
7
+
8
+ export default function App({ pathname }: AppProps = {}) {
9
+ return <RerouteProvider from={{ pathname, ...artifacts }} />;
10
+ }
@@ -0,0 +1,14 @@
1
+ import { useState } from 'react';
2
+
3
+ export default function Counter() {
4
+ const [count, setCount] = useState(0);
5
+ const increase = () => setCount((c) => c + 1);
6
+
7
+ return (
8
+ <section>
9
+ <h2>Current count: {count}</h2>
10
+ {/* biome-ignore lint/a11y/useButtonType: shut up */}
11
+ <button onClick={increase}>Increase</button>
12
+ </section>
13
+ );
14
+ }
@@ -0,0 +1,90 @@
1
+ import { Link, useContent } from 'reroute-js/react';
2
+
3
+ interface RecentPostsProps {
4
+ limit?: number;
5
+ }
6
+
7
+ function RecentPosts({ limit = 3 }: RecentPostsProps) {
8
+ const { items } = useContent({
9
+ collection: 'blog',
10
+ limit,
11
+ });
12
+
13
+ const recentPosts = items;
14
+
15
+ return (
16
+ <div style={{ marginTop: '2rem' }}>
17
+ <h2>Recent Blog Posts</h2>
18
+ <div
19
+ style={{
20
+ marginTop: '1rem',
21
+ display: 'flex',
22
+ flexDirection: 'column',
23
+ gap: '1rem',
24
+ }}
25
+ >
26
+ {recentPosts.map((post) => (
27
+ <article
28
+ key={post.slug}
29
+ style={{
30
+ padding: '1rem',
31
+ border: '1px solid #e0e0e0',
32
+ borderRadius: '8px',
33
+ background: '#fff',
34
+ }}
35
+ >
36
+ <h3 style={{ margin: '0 0 0.5rem 0', fontSize: '1.25rem' }}>
37
+ <Link
38
+ to={post.href}
39
+ style={{ textDecoration: 'none', color: '#0066cc' }}
40
+ >
41
+ {String(post.meta?.title || post.name)}
42
+ </Link>
43
+ </h3>
44
+ {post.meta?.date && (
45
+ <time style={{ fontSize: '0.875rem', color: '#666' }}>
46
+ {String(post.meta.date)}
47
+ </time>
48
+ )}
49
+ {post.meta?.excerpt && (
50
+ <p
51
+ style={{
52
+ marginTop: '0.5rem',
53
+ color: '#333',
54
+ fontSize: '0.9rem',
55
+ }}
56
+ >
57
+ {String(post.meta.excerpt)}
58
+ </p>
59
+ )}
60
+ <Link
61
+ to={post.href}
62
+ style={{
63
+ display: 'inline-block',
64
+ marginTop: '0.5rem',
65
+ color: '#0066cc',
66
+ textDecoration: 'none',
67
+ fontSize: '0.9rem',
68
+ }}
69
+ >
70
+ Read more →
71
+ </Link>
72
+ </article>
73
+ ))}
74
+ </div>
75
+ <div style={{ marginTop: '1rem' }}>
76
+ <Link
77
+ to='/blog'
78
+ style={{
79
+ color: '#0066cc',
80
+ textDecoration: 'none',
81
+ }}
82
+ >
83
+ View all posts →
84
+ </Link>
85
+ </div>
86
+ </div>
87
+ );
88
+ }
89
+
90
+ export default RecentPosts;
@@ -0,0 +1,13 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <title>{{PROJECT_NAME}}</title>
6
+
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
8
+ </head>
9
+ <body>
10
+ <div id="root"></div>
11
+ <script type="module" src="./index.tsx"></script>
12
+ </body>
13
+ </html>
@@ -0,0 +1,5 @@
1
+ import { hydrateRoot } from 'react-dom/client';
2
+ import App from './App';
3
+
4
+ // biome-ignore lint/style/noNonNullAssertion: all good
5
+ hydrateRoot(document.getElementById('root')!, <App />);
@@ -0,0 +1,21 @@
1
+ const meta = {
2
+ title: '404',
3
+ description: 'Page not found',
4
+ };
5
+
6
+ function NotFound() {
7
+ return (
8
+ <div style={{ padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
9
+ <h1>404</h1>
10
+ <p>The page you are looking for does not exist.</p>
11
+ <nav style={{ marginTop: '2rem' }}>
12
+ <a href='/' style={{ marginRight: '1rem' }}>
13
+ ← Back to Home
14
+ </a>
15
+ </nav>
16
+ </div>
17
+ );
18
+ }
19
+
20
+ export default NotFound;
21
+ export { meta };
@@ -0,0 +1,31 @@
1
+ import RecentPosts from '../components/RecentPosts';
2
+
3
+ const meta = {
4
+ title: 'About Us',
5
+ description:
6
+ 'Learn more about our application built with custom file-based routing!',
7
+ };
8
+
9
+ function About() {
10
+ return (
11
+ <div style={{ padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
12
+ <h1>About Us</h1>
13
+ <p>Welcome to our application built with custom file-based routing!</p>
14
+ <p>
15
+ This page demonstrates a simple static route that maps from{' '}
16
+ <code>routes/about.tsx</code> to <code>/about</code>.
17
+ </p>
18
+
19
+ <RecentPosts limit={1} />
20
+
21
+ <nav style={{ marginTop: '2rem' }}>
22
+ <a href='/' style={{ marginRight: '1rem' }}>
23
+ ← Back to Home
24
+ </a>
25
+ </nav>
26
+ </div>
27
+ );
28
+ }
29
+
30
+ export default About;
31
+ export { meta };
@@ -0,0 +1,21 @@
1
+ const meta = {
2
+ title: '404',
3
+ description: 'Page not found',
4
+ };
5
+
6
+ function NotFound() {
7
+ return (
8
+ <div style={{ padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
9
+ <h1>404</h1>
10
+ <p>The blog content you are looking for does not exist.</p>
11
+ <nav style={{ marginTop: '2rem' }}>
12
+ <a href='/' style={{ marginRight: '1rem' }}>
13
+ ← Back to Home
14
+ </a>
15
+ </nav>
16
+ </div>
17
+ );
18
+ }
19
+
20
+ export default NotFound;
21
+ export { meta };
@@ -0,0 +1,84 @@
1
+ import { Link, Outlet } from 'reroute-js/react';
2
+
3
+ export default function BlogLayout() {
4
+ return (
5
+ <div style={{ minHeight: '100vh', background: '#f9f9f9' }}>
6
+ {/* Blog Header */}
7
+ <header
8
+ style={{
9
+ background: '#fff',
10
+ borderBottom: '1px solid #e0e0e0',
11
+ padding: '1rem 2rem',
12
+ }}
13
+ >
14
+ <div style={{ maxWidth: '800px', margin: '0 auto' }}>
15
+ <nav
16
+ style={{
17
+ display: 'flex',
18
+ alignItems: 'center',
19
+ justifyContent: 'space-between',
20
+ }}
21
+ >
22
+ <Link
23
+ to='/blog'
24
+ style={{
25
+ fontSize: '1.5rem',
26
+ fontWeight: 'bold',
27
+ textDecoration: 'none',
28
+ color: '#333',
29
+ }}
30
+ >
31
+ 📝 Blog
32
+ </Link>
33
+ <div
34
+ style={{ display: 'flex', gap: '1.5rem', alignItems: 'center' }}
35
+ >
36
+ <Link
37
+ to='/'
38
+ style={{
39
+ textDecoration: 'none',
40
+ color: '#666',
41
+ fontSize: '0.875rem',
42
+ }}
43
+ >
44
+ Home
45
+ </Link>
46
+ <Link
47
+ to='/about'
48
+ style={{
49
+ textDecoration: 'none',
50
+ color: '#666',
51
+ fontSize: '0.875rem',
52
+ }}
53
+ >
54
+ About
55
+ </Link>
56
+ </div>
57
+ </nav>
58
+ </div>
59
+ </header>
60
+
61
+ {/* Blog Content */}
62
+ <main>
63
+ <div style={{ maxWidth: '800px', margin: '0 auto' }}>
64
+ <Outlet />
65
+ </div>
66
+ </main>
67
+
68
+ {/* Blog Footer */}
69
+ <footer
70
+ style={{
71
+ marginTop: '4rem',
72
+ padding: '2rem',
73
+ textAlign: 'center',
74
+ color: '#666',
75
+ fontSize: '0.875rem',
76
+ borderTop: '1px solid #e0e0e0',
77
+ background: '#fff',
78
+ }}
79
+ >
80
+ <p>© 2024 Reroute Blog. Built with Bun, Elysia, and React.</p>
81
+ </footer>
82
+ </div>
83
+ );
84
+ }
@@ -0,0 +1,11 @@
1
+ import { ContentRoute } from 'reroute-js/react';
2
+
3
+ export default function BlogPost() {
4
+ return (
5
+ <article style={{ padding: '2rem' }}>
6
+ <section style={{ lineHeight: '1.6' }}>
7
+ <ContentRoute collection='blog' />
8
+ </section>
9
+ </article>
10
+ );
11
+ }
@@ -0,0 +1,27 @@
1
+ // Page metadata and optional SSR extras. Reroute SSR will use these
2
+ // to generate <title>, <meta name="description"> and append any custom head.
3
+ const meta = {
4
+ title: 'Hello World',
5
+ description: 'This is the first post using Reroute 🎉',
6
+ excerpt: 'This is a great post',
7
+ date: '2025-10-20',
8
+ };
9
+
10
+ const ssr = {
11
+ head: [
12
+ '<meta property="og:type" content="article" />',
13
+ '<meta name="twitter:card" content="summary_large_image" />',
14
+ ],
15
+ };
16
+
17
+ function BlogPost() {
18
+ return (
19
+ <div>
20
+ <h1>Hello World</h1>
21
+ <p>Welcome to my blog!!</p>
22
+ </div>
23
+ );
24
+ }
25
+
26
+ export { meta, ssr };
27
+ export default BlogPost;
@@ -0,0 +1,31 @@
1
+ const meta = {
2
+ title: 'What is Reroute?',
3
+ description:
4
+ 'A dead simple file-based routing framework for building fullstack React apps on Bun and Elysia.',
5
+ date: '2025-10-22',
6
+ };
7
+
8
+ function BlogPost() {
9
+ return (
10
+ <div>
11
+ <h1>What is Reroute?</h1>
12
+ <p>
13
+ Reroute is a dead simple file-based routing framework for building
14
+ fullstack applications using React that runs on Bun and Elysia.
15
+ </p>
16
+ <p>
17
+ It features server-side rendering (SSR), automatic route generation from
18
+ your file structure, live reload in development, and zero configuration
19
+ needed to get started.
20
+ </p>
21
+ <p>
22
+ With built-in content collections, smart caching, and powerful React
23
+ hooks like useNavigate(), useData(), and useContent(), Reroute makes it
24
+ easy to build fast, SEO-friendly web applications with minimal setup.
25
+ </p>
26
+ </div>
27
+ );
28
+ }
29
+
30
+ export default BlogPost;
31
+ export { meta };