guestbook

📖 Guestbook

A simple, clean guestbook app built with Next.js 14 (App Router), Tailwind CSS, and Supabase.

Features

• ✍️ Submit messages with name and text
• 📋 View all messages sorted by newest first
• ⚡ Server-side rendering with revalidate = 0 for fresh data
• 📱 Fully responsive (mobile & desktop)
• 🎨 Clean UI with avatar initials and color coding

Getting Started

1. Install dependencies

npm install

2. Set up Supabase

1. Create a project at supabase.com
2. Run the following SQL in your Supabase SQL editor:

create table messages (
  id bigint generated always as identity primary key,
  name text not null,
  message text not null,
  created_at timestamptz default now() not null
);

-- Enable Row Level Security
alter table messages enable row level security;

-- Grant permissions to the anon role
grant select on messages to anon;
grant insert on messages to anon;

-- Allow anyone to read messages
create policy "Anyone can read messages"
  on messages for select
  using (true);

-- Allow anyone to insert messages
create policy "Anyone can insert messages"
  on messages for insert
  with check (true);

3. Configure environment variables

Copy .env.local.example to .env.local and fill in your Supabase credentials:

cp .env.local.example .env.local