new examples

2026-02-19 05:48:58 +00:00 · 2025-12-26 11:40:00 +01:00
parent 35e4d33085
commit d3a2a9d83b
1164 changed files with 101362 additions and 160055 deletions
--- a/node/tanstack-start/ssr/app/router.tsx
+++ b/node/tanstack-start/ssr/app/router.tsx
@@ -0,0 +1,14 @@
+import { createRouter as createTanStackRouter } from '@tanstack/react-router';
+import { routeTree } from './routeTree.gen';
+
+export function createRouter() {
+  return createTanStackRouter({
+    routeTree,
+  });
+}
+
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: ReturnType<typeof createRouter>;
+  }
+}
--- a/node/tanstack-start/ssr/app/routes/__root.tsx
+++ b/node/tanstack-start/ssr/app/routes/__root.tsx
@@ -0,0 +1,16 @@
+import { createRootRoute, Outlet } from '@tanstack/react-router';
+
+export const Route = createRootRoute({
+  component: () => (
+    <html>
+      <head>
+        <meta charSet="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <title>TanStack Start</title>
+      </head>
+      <body>
+        <Outlet />
+      </body>
+    </html>
+  ),
+});
--- a/node/tanstack-start/ssr/app/routes/api/env.ts
+++ b/node/tanstack-start/ssr/app/routes/api/env.ts
@@ -0,0 +1,19 @@
+import { json } from '@tanstack/react-start';
+import { createAPIFileRoute } from '@tanstack/react-start/api';
+
+// Runtime env vars (read at server startup)
+const RUNTIME_PRIVATE_VAR = process.env.RUNTIME_PRIVATE_VAR || 'default-value';
+const RUNTIME_PUBLIC_VAR = process.env.RUNTIME_PUBLIC_VAR || 'default-value';
+
+console.log('=== Runtime Variables ===');
+console.log('RUNTIME_PRIVATE_VAR:', RUNTIME_PRIVATE_VAR);
+console.log('RUNTIME_PUBLIC_VAR:', RUNTIME_PUBLIC_VAR);
+
+export const APIRoute = createAPIFileRoute('/api/env')({
+  GET: () => {
+    return json({
+      runtimePrivateVar: RUNTIME_PRIVATE_VAR,
+      runtimePublicVar: RUNTIME_PUBLIC_VAR,
+    });
+  },
+});
--- a/node/tanstack-start/ssr/app/routes/index.tsx
+++ b/node/tanstack-start/ssr/app/routes/index.tsx
@@ -0,0 +1,49 @@
+import { createFileRoute } from '@tanstack/react-router';
+import { useEffect, useState } from 'react';
+
+export const Route = createFileRoute('/')({
+  component: Home,
+});
+
+function Home() {
+  // Build-time public var (baked into bundle)
+  const buildPublicVar = import.meta.env.VITE_BUILD_PUBLIC_VAR || 'default-value';
+
+  // Runtime vars (fetched from server API)
+  const [runtimePrivateVar, setRuntimePrivateVar] = useState('loading...');
+  const [runtimePublicVar, setRuntimePublicVar] = useState('loading...');
+
+  useEffect(() => {
+    console.log('=== Build-time Variables ===');
+    console.log('VITE_BUILD_PUBLIC_VAR:', buildPublicVar);
+
+    // Fetch runtime vars from server API
+    fetch('/api/env')
+      .then((res) => res.json())
+      .then((data) => {
+        setRuntimePrivateVar(data.runtimePrivateVar);
+        setRuntimePublicVar(data.runtimePublicVar);
+        console.log('=== Runtime Variables ===');
+        console.log('RUNTIME_PRIVATE_VAR:', data.runtimePrivateVar);
+        console.log('RUNTIME_PUBLIC_VAR:', data.runtimePublicVar);
+      })
+      .catch(() => {
+        setRuntimePrivateVar('error');
+        setRuntimePublicVar('error');
+      });
+  }, [buildPublicVar]);
+
+  return (
+    <>
+      <div style={{ padding: '20px', background: '#f0f0f0', margin: '20px', borderRadius: '8px' }}>
+        <h2>Environment Variable Test</h2>
+        <h3>Build-time (baked into bundle)</h3>
+        <p><strong>VITE_BUILD_PUBLIC_VAR:</strong> {buildPublicVar}</p>
+        <h3>Runtime (read at server startup)</h3>
+        <p><strong>RUNTIME_PRIVATE_VAR:</strong> {runtimePrivateVar}</p>
+        <p><strong>RUNTIME_PUBLIC_VAR:</strong> {runtimePublicVar}</p>
+      </div>
+      <h1>Hello from TanStack Start!</h1>
+    </>
+  );
+}