Waitly

R
Renaudil y a 2 jours
0

Description

Launch a product waitlist fast using Next.js 15, Notion CMS, Upstash Redis, and Resend for email.

npx boilerapp waitly

Documentación

Deploy to Vercel

Deploy with Vercel

Core Features

  • Next.js 15: Built with the latest features of the leading React framework for performance and developer experience.
  • Notion as CMS: Seamlessly manage your waitlist entries directly within a Notion database.
  • Upstash Redis: Implement robust rate limiting for signups using serverless Redis.
  • Resend Integration: Send transactional emails (e.g., confirmation emails) through Resend using your custom domain.
  • One-Click Vercel Deploy: Get your waitlist live in minutes.
  • Tailwind CSS & React: Modern, responsive UI built with utility-first CSS and React components.
  • TypeScript: Type safety for a more robust codebase.

Why Notion as a CMS?

Notion is a versatile tool renowned for its content management capabilities and user-friendly interface. This template demonstrates how to leverage Notion as a lightweight, free, and effective Content Management System (CMS) for your waitlist.

Key Advantages:

  • Simplicity: Manage your waitlist data in a familiar Notion database.
  • No Backend Needed: Fetches data directly via Notion's API, reducing complexity.
  • Flexibility: Easily extendable to manage other types of content beyond a waitlist.
  • Collaboration: Utilize Notion's collaborative features if working with a team.

Prerequisites: Setting Up External Services

Before you can run this project, you'll need to configure a few external services:

1. Upstash Redis

Upstash provides serverless Redis. This template uses it for rate limiting signups.

  1. Sign up for a free account at Upstash.
  2. Create a new Redis database.
  3. From the database details page, note down the REST API -> Endpoint (this is your UPSTASH_REDIS_REST_URL) and REST API -> Read-only Token or a custom token with write access (this is your UPSTASH_REDIS_REST_TOKEN). Ensure the token has write permissions if you're using it for operations that modify data.

2. Resend

Resend is used for sending transactional emails (e.g., signup confirmations).

  1. Create an account at Resend.
  2. Add and verify your domain (e.g., yourdomain.com).
  3. Generate an API key from the "API Keys" section. This will be your RESEND_API_KEY.
  4. Note the email address you'll send from (e.g., waitlist@yourdomain.com). This will be your RESEND_FROM_EMAIL.

3. Notion

Your waitlist data will be stored in a Notion database.

  1. Ensure you have a Notion account and workspace.
  2. Create a new Database - Full page in your workspace. You can name it "Waitlist Users" or similar.
  3. Add the following properties (columns) to your database:
    • Name (Property type: Title) - This is usually the default first column.
    • Email (Property type: Email)
    • (Optional) Signed Up At (Property type: Created time) - For tracking when users signed up.
  4. Obtain your Notion Integration Secret:
    • Go to Notion Integrations.
    • Click "+ New integration".
    • Give it a name (e.g., "Waitlist App Integration").
    • Associate it with your workspace.
    • Under "Capabilities\

Prix

Gratuit

FREE

Comentarios (0)

FAQ

Preguntas Frecuentes

¿Tienes una pregunta? Tenemos las respuestas. Si no encuentras lo que buscas, no dudes en contactarnos.

Boilerapp es una plataforma comunitaria dedicada a compartir boilerplates, starter kits y plantillas de proyectos para desarrolladores. Nuestro objetivo es simple: hacerte ahorrar tiempo en la configuración inicial (setup) para que puedas programar lo que realmente importa. Ya busques una base de código simple o un proyecto SaaS completo, lo encontrarás aquí.

¿Tienes otras preguntas?

Nuestro equipo está aquí para ayudarte. Contáctanos y te responderemos lo antes posible.

Waitly | BoilerApp