Compute and generate dynamic social card images with React components.
This example shows how to use Vercel OG with Next.js.
You can choose from one of the following two methods to use this repository:
Deploy the example using Vercel:
Execute create-next-app
with npm or Yarn to bootstrap the example:
npx create-next-app --example https://github.com/vercel/examples/tree/main/edge-functions/vercel-og-nextjs # or yarn create next-app --example https://github.com/vercel/examples/tree/main/edge-functions/vercel-og-nextjs
Next, run Next.js in development mode:
npm install npm run dev # or yarn yarn dev
Deploy it to the cloud with Vercel (Documentation).
Compute and generate dynamic social card images with React components.
This example shows how to use Vercel OG with Next.js.
You can choose from one of the following two methods to use this repository:
Deploy the example using Vercel:
Execute create-next-app
with npm or Yarn to bootstrap the example:
npx create-next-app --example https://github.com/vercel/examples/tree/main/edge-functions/vercel-og-nextjs # or yarn create next-app --example https://github.com/vercel/examples/tree/main/edge-functions/vercel-og-nextjs
Next, run Next.js in development mode:
npm install npm run dev # or yarn yarn dev
Deploy it to the cloud with Vercel (Documentation).