Next.js with Meilisearch

This starter configures Meilisearch and InstantSearch for a Next.js application.

Deploy your own

Deploy the example using Vercel or preview live with StackBlitz

How to use

First, create a Meilisearch Cloud project.

Then, execute create-next-app with npm, Yarn, pnpm, or Bun to bootstrap the example:

npx create-next-app --example with-meilisearch with-meilisearch-app

yarn create next-app --example with-meilisearch with-meilisearch-app

pnpm create next-app --example with-meilisearch with-meilisearch-app

bunx create-next-app --example with-meilisearch with-meilisearch-app

Deploy it to the cloud with Vercel (Documentation).

Check out the docs for Local Installation to run Meilisearch locally. The Meilisearch Cloud extension configures your environment varilables for you. If you're not using it, make sure to update your environment variables.

Notes

For more examples of how to use Meilisearch with Next.js, check out our demo: Next.js App to Find Where to Stream Movies