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
-
Open
src/app/page.tsxor create a new pagepages/waitlist.tsx. -
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
- Run your Next.js development server:
npm run dev - Visit
http://localhost:3000ORhttp://localhost:3000/waitlistto test the form. - 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.