diff --git a/.gitignore b/.gitignore index 2040117..9bf2b62 100644 --- a/.gitignore +++ b/.gitignore @@ -11,4 +11,5 @@ count.txt .output .vinxi todos.json -public/uploads \ No newline at end of file +public/uploads +data \ No newline at end of file diff --git a/README.md b/README.md index 2427e4c..ad0386f 100644 --- a/README.md +++ b/README.md @@ -16,6 +16,33 @@ bun run dev 3. **`src/routes/index.tsx`** - Using `getApp()` to fetch data in loader 3. **`src/routes/ssr.tsx`** - Server Side example with `getApp()` to fetch data on server +## Directory Structure + +```txt +├── bknd.config.ts +├── bun.lock +├── docker-compose.yml +├── Dockerfile +├── package.json +├── public +├── README.md +├── src +│ ├── bknd.ts # bknd singleton initialization +│ ├── logo.svg +│ ├── router.tsx +│ ├── routes +│ │ ├── api.$.ts # bknd API handler +│ │ ├── admin.$.tsx # Admin Dashboard +│ │ ├── index.tsx # Client Side Rendering example +│ │ └── ssr.tsx # Server Side Rendering example +│ │ ├── __root.tsx +│ ├── routeTree.gen.ts +│ └── styles.css +├── tsconfig.json +└── vite.config.ts +``` + + ## API Endpoints - `GET /admin` - for Admin Dashboard diff --git a/bknd.config.ts b/bknd.config.ts index a9a148f..7955526 100644 --- a/bknd.config.ts +++ b/bknd.config.ts @@ -1,4 +1,4 @@ -import { em, entity, text, boolean, libsql } from "bknd"; +import { em, entity, text, boolean, libsql, type Connection } from "bknd"; import type { TanstackStartConfig } from "bknd/adapter/tanstack-start"; import { registerLocalMediaAdapter } from "bknd/adapter/node"; @@ -19,10 +19,17 @@ declare module "bknd" { interface DB extends Database { } } +function getDBConnection(): Connection | { url: ":memory:" | (string & {}) } { + if (process.env.NODE_ENV !== "production") return { url: ":memory:" }; + + return libsql({ + url: process.env.DATABASE_URL, + }) +} + + export default { - connection: libsql({ - url: process.env.DATABASE_URL || "http://localhost:8080", - }), + connection: getDBConnection(), options: { // the seed option is only executed if the database was empty seed: async (ctx) => { diff --git a/docker-compose.yml b/docker-compose.yml index d7fcc89..49d9cbd 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,8 +1,6 @@ services: app: - build: - context: . - dockerfile: Dockerfile + image: gitea.bsws.in/shishantbiswas/bknd-examples:tanstack-start deploy: resources: limits: diff --git a/src/bknd.ts b/src/lib/bknd.ts similarity index 93% rename from src/bknd.ts rename to src/lib/bknd.ts index 1f4ce97..5459c9f 100644 --- a/src/bknd.ts +++ b/src/lib/bknd.ts @@ -1,5 +1,5 @@ import { App } from "bknd"; -import config from "../bknd.config"; +import config from "../../bknd.config"; import { getApp as getBkndApp } from "bknd/adapter/tanstack-start"; declare global { diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 5610c66..679c07e 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -4,7 +4,7 @@ import { useRouter, useRouterState, } from "@tanstack/react-router"; -import { getApi } from "@/bknd"; +import { getApi } from "@/lib/bknd"; import { createServerFn, useServerFn } from "@tanstack/react-start"; export const completeTodo = createServerFn({ method: "POST" }) @@ -57,7 +57,6 @@ export const getTodo = createServerFn({ method: "POST" }).handler(async () => { }); export const Route = createFileRoute("/")({ - ssr:false, component: App, loader: async () => { return await getTodo(); @@ -73,11 +72,11 @@ function App() { const addTodo = useServerFn(createTodo); return ( -
+
Next.js logo @@ -102,7 +101,7 @@ function App() {
)}
- {todos.reverse().map((todo) => ( + {todos.map((todo) => (
); } - -// function App() { -// const { user, verified, register, logout, login } = useAuth(); - -// const [email, setEmail] = useState(""); -// const [password, setPassword] = useState(""); -// const [mode, setMode] = useState<"login" | "register">("login"); -// const [loading, setLoading] = useState(false); -// const [error, setError] = useState(null); - -// async function handleSubmit(e: React.SubmitEvent) { -// e.preventDefault(); -// setLoading(true); -// setError(null); -// try { -// if (mode === "login") { -// // attempt login -// await login({ email, password } as any); -// } else { -// // attempt register -// await register({ email, password } as any); -// } -// setEmail(""); -// setPassword(""); -// } catch (err: any) { -// setError(err?.message ?? String(err)); -// } finally { -// setLoading(false); -// } -// } - -// async function handleLogout() { -// setLoading(true); -// try { -// await logout(); -// } catch (err: any) { -// setError(err?.message ?? String(err)); -// } finally { -// setLoading(false); -// } -// } - -// return ( -//
-//
-//
-// TanStack Logo -//
-//
- -//
-//

Account

-// {user ? ( -//
-//
-// Signed in as: {user?.email ?? "Unknown"} -//
-//
-// Verified: {verified ? "Yes" : "No"} -//
-//
-// -// -// -// -//
-//
-// ) : ( -//
-//
-// -// -//
- -// setEmail(e.target.value)} -// required -// style={{ -// border: "1px solid white", -// padding: "4px", -// borderRadius: "4px", -// }} -// type="email" -// /> - -// setPassword(e.target.value)} -// required -// style={{ -// border: "1px solid white", -// padding: "4px", -// borderRadius: "4px", -// }} -// type="password" -// /> - -// {error ?
{error}
: null} - -// -//
-// )} -//
-//
-//
-// ); -// } diff --git a/src/routes/ssr.tsx b/src/routes/ssr.tsx index 514ffed..a9ea937 100644 --- a/src/routes/ssr.tsx +++ b/src/routes/ssr.tsx @@ -1,5 +1,8 @@ import { createFileRoute, useRouterState } from "@tanstack/react-router"; import { getRequest } from "@tanstack/react-start/server"; +import { getApi } from "@/lib/bknd"; +import { createServerFn } from "@tanstack/react-start"; +import { Link } from "@tanstack/react-router"; export const getTodo = createServerFn({ method: "POST" }).handler(async () => { const api = await getApi({}); @@ -23,21 +26,18 @@ export const Route = createFileRoute("/ssr")({ }, }); -import { getApi } from "@/bknd"; -import { createServerFn } from "@tanstack/react-start"; -import { Link } from "@tanstack/react-router"; function RouteComponent() { const { todos, user } = Route.useLoaderData(); return ( -
+
Next.js logo
&
diff --git a/src/styles.css b/src/styles.css index bafe49a..4fd6803 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,8 +1,16 @@ +@import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&display=swap'); @import "tailwindcss"; +.geist-mono-100 { + font-optical-sizing: auto; + font-weight: 100; + font-style: normal; +} + :root { --background: #ffffff; --foreground: #171717; + font-family: "Geist Mono", monospace; } @media (prefers-color-scheme: dark) { @@ -13,13 +21,13 @@ } @theme { - --font-sans: var(--font-geist-sans); - --font-mono: var(--font-geist-mono); + --font-sans: var(--font-geist-mono-100); + --font-mono: var(--font-geist-mono-100); --color-background: var(--background); --color-foreground: var(--foreground); } body { @apply bg-background text-foreground; - font-family: Arial, Helvetica, sans-serif; + font-family: var(--font-geist-mono-100) }