Skip to content
Avatar of vercelvercel/examples

Vercel Blob Next.js Starter

Simple Next.js template that uses Vercel Blob for image uploads

Framework
Use Case
Database
opengraph-image

Vercel Blob Next.js Starter

Simple Next.js template that uses Vercel Blobfor image uploads

Demo

https://blob-starter.vercel.app/

How to Use

You can choose from one of the following two methods to use this repository:

One-Click Deploy

Deploy the example using Vercel:

Clone and Deploy

Execute create-next-app with pnpm to bootstrap the example:

pnpm create next-app --example https://github.com/vercel/examples/tree/main/storage/blob-starter

Once that's done, copy the .env.example file in this directory to .env.local (which will be ignored by Git):

cp .env.example .env.local

Then open .env.local and set the environment variables to match the ones in your Vercel Storage Dashboard.

Next, run Next.js in development mode:

pnpm dev

Deploy it to the cloud with Vercel (Documentation).

opengraph-image
Avatar of vercelvercel/examples

Vercel Blob Next.js Starter

Simple Next.js template that uses Vercel Blob for image uploads

Framework
Use Case
Database

Vercel Blob Next.js Starter

Simple Next.js template that uses Vercel Blobfor image uploads

Demo

https://blob-starter.vercel.app/

How to Use

You can choose from one of the following two methods to use this repository:

One-Click Deploy

Deploy the example using Vercel:

Clone and Deploy

Execute create-next-app with pnpm to bootstrap the example:

pnpm create next-app --example https://github.com/vercel/examples/tree/main/storage/blob-starter

Once that's done, copy the .env.example file in this directory to .env.local (which will be ignored by Git):

cp .env.example .env.local

Then open .env.local and set the environment variables to match the ones in your Vercel Storage Dashboard.

Next, run Next.js in development mode:

pnpm dev

Deploy it to the cloud with Vercel (Documentation).

Unleash New Possibilities

Deploy your app on Vercel and unlock its full potential