Skip to main content
Version: Next

Create a Waiting List

A waiting list is a great way to generate early interest in your SaaS product before launch. This guide will walk you through setting up a waiting list using SaaS Developer Templates.


Step 1: Add the Form to a Page

  1. Open src/app/page.tsx or create a new page pages/waitlist.tsx.

  2. Import and use the form component:

    /* <--- your imports ----> */
    import { Waitlist } from '@/components/waitlist/Waitlist';

    export default function Home() {
    return (
    <PageWithHeaderFooter>
    {/* <--- your imports ----> */}
    <Waitlist />
    </PageWithHeaderFooter>
    );
    }

Step 5: Test Your Setup

  1. Run your Next.js development server:
    npm run dev
  2. Visit http://localhost:3000 OR http://localhost:3000/waitlist to test the form.
  3. Enter an email and check if it gets stored in your database using Prisma Studio:
    npx prisma studio

Conclusion

Your waiting list is now set up and ready to capture user interest before your SaaS launch! 🎉

For further enhancements, consider integrating an email service to send confirmation emails.

Proceed to the next step: Configure Authentication.