https://github.com/clerk/clerk-instantdb-nextjs
The official companion repo for Clerk's Instant integration using Next.js App Router
https://github.com/clerk/clerk-instantdb-nextjs
Last synced: over 1 year ago
JSON representation
The official companion repo for Clerk's Instant integration using Next.js App Router
- Host: GitHub
- URL: https://github.com/clerk/clerk-instantdb-nextjs
- Owner: clerk
- Created: 2024-09-05T16:10:18.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-09-05T17:48:40.000Z (almost 2 years ago)
- Last Synced: 2025-03-10T11:35:50.774Z (over 1 year ago)
- Language: TypeScript
- Size: 371 KB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Clerk, InstantDB, and Next.js App Router Demo
## Introduction
[Clerk](https://clerk.com/) is a developer-first authentication and user management solution. It provides pre-built React components and hooks for sign-in, sign-up, user profile, and organization management. Clerk is designed to be easy to use and customize, and can be dropped into any React or Next.js application.
[InstantDB](https://instantdb.com/) is a real-time, client-side database that allows developers to easily build collaborative, offline-enabled applications without worrying about backend infrastructure.
Integrating InstantDB with Clerk gives you the benefits of using an InstantDB database while leveraging Clerk's authentication, prebuilt components, and webhooks.
After following [the Clerk + InstantDB integration guide](https://clerk.com/docs/integrations/databases/instantdb), you will have learned how to:
- Configure your Clerk session token to include the email claim.
- Configure InstantDB to use your Clerk application.
- Integrate InstantDB into your Clerk application.
## Deploy
Easily deploy the template to Vercel with the button below. You will need to set the required environment variables in the Vercel dashboard.
[](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fclerk%2Fclerk-instantdb-nextjs&env=NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY,CLERK_SECRET_KEY&envDescription=Clerk%20API%20keys&envLink=https%3A%2F%2Fclerk.com%2Fdocs%2Fintegrations%2Fdatabases%2Finstantdb&redirect-url=https%3A%2F%2Fclerk.com%2Fdocs%2Fintegrations%2Fdatabases%2Finstantdb)
## Running the template
```bash
git clone https://github.com/clerk/clerk-instantdb-nextjs
```
To run the example locally, you need to:
1. Sign up for a Clerk account at [https://clerk.com](https://dashboard.clerk.com/sign-up?utm_source=DevRel&utm_medium=docs&utm_campaign=templates&utm_content=clerk-instantdb-nextjs).
2. Go to the [Clerk dashboard](https://dashboard.clerk.com?utm_source=DevRel&utm_medium=docs&utm_campaign=templates&utm_content=clerk-instantdb-nextjs) and create an application.
3. Set the required Clerk environment variables as shown in [the example `env.local.example` file](./.env.local.example).
4. `npm install` the required dependencies.
5. Follow [the Clerk + InstantDB integration guide](https://clerk.com/docs/integrations/databases/instantdb) to set up your Instant database.
6. `npm run dev` to launch the development server.
## Learn more
To learn more about Clerk and Next.js, check out the following resources:
- [Quickstart: Get started with Next.js and Clerk](https://clerk.com/docs/quickstarts/nextjs?utm_source=DevRel&utm_medium=docs&utm_campaign=templates&utm_content=clerk-instantdb-nextjs)
- [Clerk Documentation](https://clerk.com/docs?utm_source=DevRel&utm_medium=docs&utm_campaign=templates&utm_content=clerk-instantdb-nextjs)
- [Next.js Documentation](https://nextjs.org/docs)
## Found an issue or want to leave feedback
Feel free to create a support thread on our [Discord](https://clerk.com/discord). Our support team will be happy to assist you in the `#support` channel.
## Connect with us
You can discuss ideas, ask questions, and meet others from the community in our [Discord](https://discord.com/invite/b5rXHjAg7A).
If you prefer, you can also find support through our [Twitter](https://twitter.com/ClerkDev), or you can [email](mailto:support@clerk.dev) us!