---
title: "Zeitlist: Waitlist App with Email Validation"
description: "Vercel-ready Next.js waitlist. Arcjet ensures valid emails before hitting your Upstash Redis list. Deploy a cleaner, faster waitlist app."
url: "https://vercel.com/templates/next.js/zeitlist"
links:
  repository: "https://github.com/zeitgg/zeitlist"
  demo: "https://zeitlist-one.vercel.app/"
  deploy: "https://vercel.com/new/clone?demo-title=Zeitlist%3A+Waitlist+App+with+Email+Validation&demo-description=Vercel-ready+Next.js+waitlist.+Arcjet+ensures+valid+emails+before+hitting+your+Upstash+Redis+list.+Deploy+a+cleaner%2C+faster+waitlist+app.&demo-url=https%3A%2F%2Fzeitlist-one.vercel.app%2F&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F7MVd1oCu5LvjJJJg2Pi2ua%2Ff1725cdcde75db291cc7fd817da614b0%2Fvercel_thumbnail.png&project-name=Zeitlist%3A+Waitlist+App+with+Email+Validation&repository-name=zeitlist&repository-url=https%3A%2F%2Fgithub.com%2Fzeitgg%2Fzeitlist&from=templates&skippable-integrations=1"
---

# Zeitlist: Waitlist App with Email Validation

Vercel-ready Next.js waitlist. Arcjet ensures valid emails before hitting your Upstash Redis list. Deploy a cleaner, faster waitlist app.

# Zeitlist

this is a waitlist app. it uses redis. and arcjet to validate emails.

![](https://github.com/zeitgg/zeitlist/blob/main/zeitlist.gif?raw=true)

## Core Functionality

- Provides a simple form for users to submit their email.
- Validates submitted emails using Arcjet before processing.
- Stores valid emails in a Redis list managed by Upstash.
- Displays a live count of total signups.

## Tech Used

- **Framework:** Next.js
- **Database:** Upstash (Redis)
- **Email Validation:** Arcjet
- **Styling:** Tailwind CSS
- **Language:** TypeScript

## Local Setup

To get this running on your machine:

1.  **Clone it:**

    ```bash
    git clone ``https://github.com/zeitgg/zeitlist.git`
    cd zeitlist
    ```

2.  **Install dependencies:**

    ```bash
    bun i
    ```

3.  **Set up environment variables:**
    You'll need API keys/URLs. Create a `.env.local` file in the root directory and dd these variables:

    ```plaintext
    # Get from your Upstash dashboard
    UPSTASH_REDIS_REST_URL="YOUR_UPSTASH_REDIS_URL"
    UPSTASH_REDIS_REST_TOKEN="YOUR_UPSTASH_REDIS_TOKEN"

    # Get from your Arcjet dashboard
    ARCJET_SITE_KEY="YOUR_ARCJET_SITE_KEY"
    ```

4.  **Run the dev server:**

    ```bash
    bun dev
    ```

5.  **Open in browser:** `http://localhost:3000`

## How it Works (Quick Overview)

1.  User submits their email via the frontend.
2.  The submission hits an API route (e.g., `/api/waitlist/`).
3.  This API route first passes the email to Arcjet for validation.
4.  If Arcjet approves, the email is added to a list in Redis using the Upstash SDK.
5.  A separate API route (e.g., `/api/waitlist/count`) reads the length of the Redis list to get the current signup count.
6.  The frontend fetches from the count endpoint and displays the number.

## Contributing

Issues and PRs welcome.

## License

[MIT License](https://github.com/zeitgg/zeitlist/tree/main/LICENSE)

## Related Templates

### [Get Started with Upstash Redis & Next.js](https://vercel.com/templates/next.js/get-started-with-upstash-redis-and-next-js)

A simple example to demonstrate Upstash Redis with Next.js.

---

## Additional documentation

The [Vercel Knowledge Base](https://vercel.com/kb) contains guides and answers to common questions about Vercel, including deployment, framework configuration, domains, caching, and troubleshooting.
