This tutorial uses Redis as state store for a Next.js application. We simply add a counter that pulls the data from Redis.
1 Create Next.js Project#
Run this in terminal
npx create-next-app -e https://github.com/upstash/examples/tree/master/nextjs-with-redis nextjs-with-redis
2 Create a Redis (Upstash) Database#
- Create a database as getting started
3 Set up environment variables#
.env.local.example file in this directory to
cp .env.local.example .env.local
REDIS_URL: Copy the url in the database page Upstash console
which will be ignored by Git
4 Run the app#
Install dependencies packages
Let's run the project
Go to http://localhost:3000/ 🎉
- For best performance the application should run in the same region with the Redis database's region.
- Alternatively, counter can be read from the APIs instead of getServerSideProps().