Pages Router

GitHub Repository

You can find the project source code on GitHub.

This is a quickstart for Vercel Serverless Functions. If you want to use Edge Runtime, Vercel recommends icrementally adopting the App Router.

Project Setup

Let’s create a new Next.js application with Pages Router and install @upstash/redis package.

npx create-next-app@latest
cd my-app
npm install @upstash/redis

Database Setup

Create a Redis database using Upstash Console or Upstash CLI and copy the UPSTASH_REDIS_REST_URL and UPSTASH_REDIS_REST_TOKEN into your .env file.

.env

UPSTASH_REDIS_REST_URL=<YOUR_URL>
UPSTASH_REDIS_REST_TOKEN=<YOUR_TOKEN>

Function Setup

Update /pages/api/hello.ts:

/pages/api/hello.ts

import { Redis } from "@upstash/redis";
import type { NextApiRequest, NextApiResponse } from "next";

const redis = Redis.fromEnv();

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse,
) {
  const count = await redis.incr("counter");
  res.status(200).json({ count });
}

Run & Deploy

Run the app locally with npm run dev, check http://localhost:3000/api/hello

Deploy your app with vercel

You can also integrate your Vercel projects with Upstash using Vercel Integration module. Check this article.