A waitlist with referral links for a Next.js app

02The form

A client component that reads ?ref= from the URL, posts the email, and shows the position and the person's own referral link from the response.

"use client";
import { useState } from "react";

export function Waitlist() {
  const [result, setResult] = useState<{ position: number; referral_code: string } | null>(null);
  async function submit(e: React.FormEvent<HTMLFormElement>) {
    e.preventDefault();
    const email = new FormData(e.currentTarget).get("email");
    const ref = new URLSearchParams(location.search).get("ref");
    const r = await fetch("https://api.nordva.dev/v1/waitlist/signups", {
      method: "POST",
      headers: { Authorization: `Bearer ${process.env.NEXT_PUBLIC_NORDVA_PUBLISHABLE_KEY}`, "Content-Type": "application/json" },
      body: JSON.stringify({ email, referrer_code: ref ?? undefined }),
    });
    const { data } = await r.json();
    setResult(data);
  }
  if (result) return <p>You are #{result.position}. Share {location.origin}/?ref={result.referral_code} with friends.</p>;
  return <form onSubmit={submit}><input name="email" type="email" required /><button>Join</button></form>;
}

03Or the widget

One tag on any page. It captures the referrer and UTM values for attribution as well, without a cookie.

<script src="https://cdn.nordva.dev/v1/waitlist.js" data-key="nv_pub_live_…" async></script>

04Launch day

Invite the first N in position order with POST /v1/waitlist/invites, or ask the agent to invite_from_waitlist. Then send one announcement email to everyone still waiting from Dashboard → Waitlist → Announce, previewed first, one a day at most.

Questions