From 4fb8dc92f854a7e48c6724767fbd1e6509a57ad6 Mon Sep 17 00:00:00 2001 From: reoring Date: Mon, 18 May 2026 08:32:23 +0900 Subject: [PATCH] feat: add database-backed AppThrust template --- README.md | 43 ++--- app/actions.ts | 14 ++ app/layout.tsx | 4 +- app/page.tsx | 221 ++++++++++++++++------ db/migrations/0001_init.sql | 9 + lib/db.ts | 129 +++++++++++++ package-lock.json | 359 +++++++++++++++++++++++++++--------- package.json | 9 +- 8 files changed, 609 insertions(+), 179 deletions(-) create mode 100644 app/actions.ts create mode 100644 db/migrations/0001_init.sql create mode 100644 lib/db.ts diff --git a/README.md b/README.md index e215bc4..ccb2a61 100644 --- a/README.md +++ b/README.md @@ -1,36 +1,21 @@ -This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app). +# AppThrust Next.js PostgreSQL template -## Getting Started +This starter proves the AppThrust managed PostgreSQL path: -First, run the development server: +- AppThrust injects `DATABASE_URL` through `ComponentConnection`. +- The initial schema is applied through `DatabaseChange`. +- The Next.js app reads and writes `appthrust_demo_messages`. + +The app does not run migrations on startup. For local development, apply +`db/migrations/0001_init.sql` to your PostgreSQL database, then set: ```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev +DATABASE_URL=postgresql://app:password@localhost:5432/app ``` -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. +Run locally: -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details. +```bash +npm install +npm run dev +``` diff --git a/app/actions.ts b/app/actions.ts new file mode 100644 index 0000000..c987757 --- /dev/null +++ b/app/actions.ts @@ -0,0 +1,14 @@ +"use server"; + +import { revalidatePath } from "next/cache"; +import { insertDemoMessage } from "@/lib/db"; + +export async function createMessage(formData: FormData) { + const body = String(formData.get("body") ?? "").trim(); + if (!body) { + return; + } + + await insertDemoMessage(body); + revalidatePath("/"); +} diff --git a/app/layout.tsx b/app/layout.tsx index 976eb90..b6621b3 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -13,8 +13,8 @@ const geistMono = Geist_Mono({ }); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "AppThrust PostgreSQL sample", + description: "A database-backed starter application for AppThrust", }; export default function RootLayout({ diff --git a/app/page.tsx b/app/page.tsx index 3f36f7c..a4ae8ac 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,65 +1,168 @@ -import Image from "next/image"; +import { createMessage } from "./actions"; +import { loadDemoMessages } from "@/lib/db"; + +export const dynamic = "force-dynamic"; + +export default async function Home() { + const database = await loadDemoMessages(); -export default function Home() { return ( -
-
- Next.js logo -
-

- To get started, edit the page.tsx file. -

-

- Looking for a starting point or more instructions? Head over to{" "} - - Templates - {" "} - or the{" "} - +

+
+
+

+ AppThrust sample +

+

+ Managed PostgreSQL messages +

+
+ +
+ +
+ + + +
+ +
+
+
+

Recent messages

+
+
+ {database.messages.length > 0 ? ( + database.messages.map((message) => ( +
+

{message.body}

+

+ #{message.id} ยท {message.createdAt} +

+
+ )) + ) : ( +
+ {emptyStateMessage(database.status)} +
+ )} +
+
+ +
-
- - Vercel logomark - Deploy Now - - - Documentation - -
-
+ +