How to Use FreeWaitlists with Claude Code: Add a Waitlist in Minutes
Step-by-step guide to integrating FreeWaitlists into your project using Claude Code, Anthropic's AI coding agent. Embed widgets, use the API, and collect emails without leaving your terminal.
How to Use FreeWaitlists with Claude Code
Claude Code is Anthropic's agentic coding tool that lives in your terminal. It can read your codebase, edit files, run commands, and interact with APIs -- all through natural language. Combined with FreeWaitlists, you can add a fully working waitlist to any project in minutes without leaving the command line.
This guide walks through practical workflows for using FreeWaitlists with Claude Code, whether you're building a landing page, a full-stack app, or just want to collect emails fast.
Why Claude Code + FreeWaitlists Work So Well Together
Claude Code understands your project context. It reads your files, knows your stack, and can make changes across multiple files at once. FreeWaitlists provides a dead-simple API and embeddable widget that requires zero backend setup.
Together, they let you:
- Add a waitlist to an existing project with a single prompt
- Make API calls to FreeWaitlists directly from your workflow
- Customize and embed the widget without copy-pasting from docs
- Build custom signup flows using the public API
No context switching. No tab juggling. Just describe what you want and ship it.
Getting Started: Prerequisites
1. Create a FreeWaitlists account
Sign up for free at freewaitlists.com. Create a new waitlist from the dashboard and copy your waitlist ID. No credit card required.
2. Install Claude Code
Follow the official installation guide to install Claude Code on macOS, Linux, or Windows. You'll need a Claude Pro, Max, Teams, or Enterprise account -- see Anthropic's authentication docs for details.
Once installed, open a terminal in your project directory and run claude to start a session.
Method 1: Embed the FreeWaitlists Widget with Claude Code
The fastest way to add a waitlist signup form to any website. Open Claude Code in your project directory and describe what you want:
claude "Add a FreeWaitlists signup widget to my landing page.
Use waitlist ID YOUR_WAITLIST_ID.
Put it in the hero section below the subheadline."
Claude Code will read your landing page, find the hero section, and insert the widget script tag:
<script
src="https://freewaitlists.com/widgets/custom-widget.js"
data-waitlist-id="YOUR_WAITLIST_ID"
defer
></script>
That's it. The widget handles the form UI, validation, submission, and success state. No backend code, no database, no email infrastructure needed.
Customizing the Widget Appearance
You can ask Claude Code to customize the widget styling in the same prompt:
claude "Add a FreeWaitlists widget to my homepage with waitlist ID YOUR_WAITLIST_ID.
Make the button red (#EF4444) with white text, use a light red background (#FEF2F2),
set the title to 'Get Early Access', and the button text to 'Join Now'."
Claude Code will generate the script tag with the right data- attributes:
<script
src="https://freewaitlists.com/widgets/custom-widget.js"
data-waitlist-id="YOUR_WAITLIST_ID"
data-title="Get Early Access"
data-button-text="Join Now"
data-button-color="#EF4444"
data-button-font-color="#FFFFFF"
data-background-color="#FEF2F2"
defer
></script>
No need to look up the docs for every attribute name. Just describe what you want and let Claude Code figure out the implementation.
Method 2: Build a Custom Signup Form with the FreeWaitlists API
If you want full control over the UI, skip the widget and hit the FreeWaitlists API directly. This is ideal when you have a custom design system or need to integrate signups into an existing form.
Ask Claude Code to build a custom signup component:
claude "Create a waitlist signup form component for my Next.js app.
Use the FreeWaitlists API to submit entries.
POST to https://api.freewaitlists.com/waitlists/YOUR_WAITLIST_ID
with email and meta fields. Show a success message after signup."
Claude Code will create something like this:
'use client'
import { useState } from 'react'
export function WaitlistForm() {
const [email, setEmail] = useState('')
const [status, setStatus] = useState<'idle' | 'loading' | 'success' | 'error'>('idle')
async function handleSubmit(e: React.FormEvent) {
e.preventDefault()
setStatus('loading')
const res = await fetch(
'https://api.freewaitlists.com/waitlists/YOUR_WAITLIST_ID',
{
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
email,
meta: { source: 'landing-page' },
}),
}
)
setStatus(res.ok ? 'success' : 'error')
}
if (status === 'success') {
return <p>You're on the list! We'll be in touch.</p>
}
return (
<form onSubmit={handleSubmit}>
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder="[email protected]"
required
/>
<button type="submit" disabled={status === 'loading'}>
{status === 'loading' ? 'Joining...' : 'Join Waitlist'}
</button>
</form>
)
}
The public API requires no authentication for adding entries. Just POST an email and optional metadata.
FreeWaitlists API Reference: Add an Entry
Endpoint (no auth required):
POST https://api.freewaitlists.com/waitlists/{waitlist_id}
Request body:
{
"email": "[email protected]",
"meta": {
"name": "Jane Smith",
"source": "landing-page"
}
}
Success response:
{
"success": true,
"message": "Successfully added to waitlist",
"id": "clx1a2b3c4d5e6f7g8h9i0j"
}
Check the full FreeWaitlists API documentation for more details.
Method 3: Retrieve Waitlist Entries via API (Pro Plan)
If you're on the Pro plan, you can use Claude Code to fetch and work with your waitlist data programmatically. This is useful for building admin dashboards, running analytics, or syncing entries to other tools.
claude "Write a script that fetches all entries from my FreeWaitlists waitlist
and exports them to a CSV file. Use API key fwl_YOUR_API_KEY and waitlist ID YOUR_WAITLIST_ID."
Claude Code will generate a script using the authenticated GET endpoint:
curl -X GET "https://api.freewaitlists.com/waitlists/YOUR_WAITLIST_ID/entries?page=1&limit=100" \
-H "Authorization: Bearer fwl_YOUR_API_KEY" \
-H "Content-Type: application/json"
The response includes paginated entries with full email and metadata:
{
"entries": [
{
"id": "clx1a2b3c4d5e6f7g8h9i0j",
"email": "[email protected]",
"meta": { "name": "Jane Smith" },
"createdAt": "2026-03-01T10:00:00Z"
}
],
"pagination": {
"page": 1,
"limit": 100,
"totalCount": 250,
"totalPages": 3,
"hasNext": true
}
}
Lighter Alternative: Get Just the Count
If you only need the number of signups (for example, to display a live counter on your landing page), use the count endpoint instead. It returns only the total without any entry data:
curl -X GET "https://api.freewaitlists.com/waitlists/YOUR_WAITLIST_ID/entries/count" \
-H "Authorization: Bearer fwl_YOUR_API_KEY"
{
"count": 250,
"waitlist": {
"id": "YOUR_WAITLIST_ID",
"name": "My Product"
}
}
No emails are exposed, making it safe for client-facing integrations.
You can generate API keys from the FreeWaitlists dashboard under the API section.
Practical Claude Code Prompts for FreeWaitlists
Here are copy-paste prompts you can use with Claude Code right now.
Add a waitlist widget to an existing site
claude "Add a FreeWaitlists widget to my index.html. Waitlist ID: YOUR_WAITLIST_ID.
Place it after the pricing section. Match the site's color scheme."
Build a pre-launch landing page from scratch
claude "Create a simple pre-launch landing page with a headline, subheadline,
and a FreeWaitlists signup widget. Waitlist ID: YOUR_WAITLIST_ID.
Use Tailwind CSS and keep it minimal."
Track signup sources with UTM metadata
claude "Update my waitlist form to include UTM parameters from the URL
in the meta field when submitting to FreeWaitlists."
Export waitlist entries to a CSV file
claude "Write a Node.js script that fetches all entries from FreeWaitlists
using my API key fwl_YOUR_API_KEY and exports them to entries.csv with columns:
email, name, signup date, source."
Display a live signup counter on your landing page
claude "Add a live signup counter to my landing page that shows how many people
have joined the waitlist. Use the FreeWaitlists count API endpoint
GET https://api.freewaitlists.com/waitlists/YOUR_WAITLIST_ID/entries/count
with API key fwl_YOUR_API_KEY. Show it as 'Join 250+ others on the waitlist'."
Set up webhook notifications for new signups
claude "I want to get notified in Slack when someone joins my waitlist.
Set up a webhook endpoint that receives FreeWaitlists webhook events
and posts a message to my Slack channel."
Tips for Getting the Best Results
Be specific about placement. Tell Claude Code exactly where in your page or component you want the widget. "Below the hero headline" or "inside the footer" works better than "somewhere on the page."
Include your waitlist ID in the prompt. Claude Code can't look it up for you, so paste it directly into your instruction.
Mention your tech stack. If you're using React, Next.js, Vue, Astro, or plain HTML, say so. Claude Code adapts the implementation to match your framework.
Use metadata wisely. The meta field in the FreeWaitlists API accepts any JSON object. Track referral sources, user roles, company names, or anything else that helps you segment your waitlist later.
Start with the widget, upgrade to the API later. The embeddable widget gets you live in seconds. If you need more control over the UI down the line, switch to direct API calls. Both approaches work with the same waitlist.
Use Claude Code's headless mode for automation. You can pipe prompts to Claude Code in scripts for batch operations, like exporting entries on a schedule. See the Claude Code SDK docs for programmatic usage.
Frequently Asked Questions
Is FreeWaitlists really free?
Yes. The free tier lets you create waitlists and collect signups with no credit card required. The Pro plan unlocks API access for retrieving entries, higher limits, and advanced features like webhooks.
Do I need a paid Claude plan to use Claude Code?
Yes. Claude Code requires a Claude Pro, Max, Teams, or Enterprise subscription. The free Claude.ai plan does not include Claude Code access. See Anthropic's pricing for current plans.
Can I use Claude Code with any frontend framework?
Absolutely. Claude Code works with React, Next.js, Vue, Svelte, Astro, plain HTML, and anything else. It reads your project files and adapts its output to match your stack.
Does the FreeWaitlists widget work on mobile?
Yes. The embeddable widget is fully responsive and works on all screen sizes out of the box.
Conclusion: Ship Your Waitlist Faster
Claude Code and FreeWaitlists solve two different bottlenecks in shipping fast. Claude Code removes the friction of writing boilerplate and looking up documentation. FreeWaitlists removes the friction of backend setup for collecting signups.
The workflow is simple:
- Open your terminal
- Tell Claude Code what you want
- Get a working waitlist in your project
- Start collecting emails
No dashboard tab-switching. No copying code snippets from documentation pages. No building a backend just to store email addresses. Just describe it and ship it.
Get started at freewaitlists.com -- your first waitlist is free, and setup takes 30 seconds.
Learn more about our Waitlist Tool: