Next.js + EmailOctopus Waitlist Page is an open-source Next.js landing page template that captures visitor email addresses through the EmailOctopus API, built with TypeScript and Tailwind CSS.
What is the Next.js + EmailOctopus Waitlist Page?
This template is a single-page waitlist landing page designed to collect email signups before a product launch. It takes a visitor's email address as input and sends it to EmailOctopus via its API, storing it in your email list. The page runs on Next.js, uses TypeScript for type safety, and is styled with Tailwind CSS. It was designed in Figma and made publicly available by developer soufianeelc, with the repository receiving over 120 stars.
Key Features
- Next.js framework — Uses the React-based Next.js framework for server-side rendering and static site generation, deployable to Vercel, Netlify, or any Node.js host.
- TypeScript support — The codebase is written in TypeScript, giving you compile-time type checking for safer prop passing and API calls.
- Tailwind CSS styling — Styled with Tailwind CSS utility classes, making the layout easy to customize directly in your JSX.
- EmailOctopus integration — Submissions are sent to the EmailOctopus API, so captured emails appear in your EmailOctopus contact list without extra wiring.
- Figma-designed layout — The UI was originally designed in Figma, giving it a polished, conversion-focused appearance rather than a generic default template.
- Mobile responsive — The page adapts to phone, tablet, and desktop viewports, so signups work on any device.
- Open-source licensing — The full source code is available on GitHub, so you can fork, modify, and redistribute it freely.
- Environment variable configuration — EmailOctopus credentials are read from environment variables defined in a
.env.example file, keeping your API keys out of the codebase.
Who is it for?
- Startup founders — Set up a professional waitlist page in minutes to collect early interest before a product MVP is ready.
- Indie hackers — Use the template as a lightweight landing page for a side project, connecting it to a free EmailOctopus account to manage leads.
- Developers — Fork the repository and customize the design or replace the EmailOctopus API call with another email service, since the code is straightforward Next.js.
What can you do with it?
- Launch a pre-product waitlist: Replace the default text, set your EmailOctopus API key, deploy to your host, and start collecting emails within an hour.
- A/B test landing page copy: Because the page is a single Next.js component, you can swap headings, button text, and background styling quickly.
- Learn integration patterns: Read the source to see how a Next.js API route or client-side fetch can call an external service like EmailOctopus with typed request and response objects.
How does it work?
Clone the repository from GitHub, install dependencies with pnpm install, then deploy the project to your hosting platform. After deployment, set the environment variables shown in the .env.example file (including your EmailOctopus API key and list ID) on your host so the page can send signups to your email list.
FAQ
Is this template free?
Yes, the repository is open-source, meaning the code is free to use, modify, and deploy. The README also links a Buy Me a Coffee page if you want to support the developer, but it is optional.
Which email service does it use?
It uses EmailOctopus. Visitor email addresses are sent to the EmailOctopus API and added to your EmailOctopus list. You need an EmailOctopus account and API key, which you configure via environment variables.
Is the page mobile-friendly?
Yes, the README explicitly states it is mobile responsive, so the waitlist form and design adapt to smaller screens.
How do I get support?
The README lists a contact email ([email protected]) for issues encountered during deployment or setup. Developers can also open issues on the GitHub repository.
What technologies are used?
The stack is Next.js, TypeScript, and Tailwind CSS. The design was made in Figma, and the project is intended to be deployed to any Node-friendly hosting service.
