Write a colourful, animated love letter, pair it with a song from Spotify, and share it with one link.

• Next.js 16 (App Router, TypeScript) for frontend + API routes
• Tailwind CSS v4 for styling, Framer Motion for animation
• Neon (serverless Postgres) + Drizzle ORM for storage
• Spotify Web API (Client Credentials flow) for song search + embedded playback

No login is required for either the letter writer or the recipient — creating a letter just produces a shareable /letter/[slug] link.

npm install

1. Create a free project at neon.tech.
2. Copy the pooled connection string it gives you.
3. Copy .env.example to .env.local and paste it into DATABASE_URL.

1. Create an app at the Spotify Developer Dashboard (free).
2. Any redirect URI works (e.g. http://localhost:3000) — this app only uses the Client Credentials flow (app-only auth) to search tracks, so no user login/redirect is actually used.
3. Copy the Client ID and Client Secret into .env.local as SPOTIFY_CLIENT_ID / SPOTIFY_CLIENT_SECRET.

cp .env.example .env.local
# then fill in DATABASE_URL, SPOTIFY_CLIENT_ID, SPOTIFY_CLIENT_SECRET

npm run db:push

npm run dev

Visit http://localhost:3000.

• / — landing page
• /create — a multi-step form (names → theme → message → song → review) that POSTs to /api/letters and returns a shareable slug
• /letter/[slug] — the recipient's view: an animated envelope that opens into the letter, with the chosen song embedded below it
• /api/spotify/search — server-side Spotify track search (keeps API credentials off the client)

Any Next.js host works (e.g. Vercel). Set the same environment variables there, and update NEXT_PUBLIC_BASE_URL to your production URL.