A polished waitlist page for your next launch. Every signup lands in a Google Sheet and pings your team in Slack. Built on One.
Template page: withone.ai/templates-vibe/waitlist-landing
- A polished hero, feature highlights, and an email signup form, ready to restyle
- Every signup appends a row to a Google Sheet through the One SDK
- Your team gets a Slack ping for each new signup (optional, skip it if you want)
- No database and no signup vendor to configure
Out of the box the app runs in demo mode, so it works before you add any keys. All the copy (brand, headline, subtext, features) lives in one file: src/lib/site.ts.
npm install
cp .env.example .env # fill it in (see below)
npm run dev # http://localhost:3000| Variable | What it is |
|---|---|
ONE_API_KEY |
Your One API key. Run one init or copy it from the One dashboard. |
ONE_CONNECTION_SHEETS |
The key of your Google Sheets connection on One. Connect with one add google-sheets, then one list shows the key. |
WAITLIST_SHEET_ID |
The spreadsheet id from the sheet URL: docs.google.com/spreadsheets/d/<this part>/edit. |
ONE_CONNECTION_SLACK |
Optional. Your Slack connection key on One (one add slack). |
SLACK_CHANNEL |
Optional. The channel to ping, e.g. #launch. |
Leave the two Slack vars empty and signups still land in the sheet, just without the ping.
- Replit: replit.com/github.com/withoneai/template-waitlist
- Bolt.new: bolt.new/github.com/withoneai/template-waitlist
After importing, add the keys above as secrets and restart.
Signup form ──server action──▶ joinWaitlist(email)
│
▼
One SDK ──▶ Google Sheets
append [email, timestamp, "waitlist"]
│
▼
One SDK ──▶ Slack ping (optional)
"New waitlist signup: …"
src/lib/site.ts: all the page copy, edit this to make it yourssrc/lib/waitlist.ts: the Sheets append and the Slack pingsrc/app/actions.ts: the server action the form posts tosrc/app/waitlist-form.tsx: the email form
MIT