Guestbook

A small guestbook built with Next.js 16 (App Router, Server Actions, Cache Components) and Tailwind CSS.

Getting started

Entries are stored in Upstash Redis. Create a database (free tier is fine), then add its REST credentials to .env.local:

UPSTASH_REDIS_REST_URL=https://...upstash.io
UPSTASH_REDIS_REST_TOKEN=...

npm install
npm run dev

Open http://localhost:3000 and sign the guestbook.

How it works

• src/app/page.tsx renders the form and streams the entry list inside a <Suspense> boundary.
• src/app/guestbook-form.tsx is a client component using useActionState for validation errors and pending state.
• src/app/actions.ts holds the signGuestbook Server Action, which validates input, saves the entry and revalidates /.
• src/lib/guestbook.ts stores entries as a Redis list (guestbook:entries), newest first.

Deploying to Vercel

Add Upstash Redis from the project's Storage tab (Marketplace). The integration sets KV_REST_API_URL and KV_REST_API_TOKEN, which the client picks up automatically. Run vercel env pull .env.local to use the same database locally.