Skip to content

MongoDB Starter

A developer directory built on Next.js and MongoDB Atlas.

Framework Next.js
Use Case Starter
CSS Tailwind
Database MongoDB
Auth NextAuth.js
Publisher ▲ Vercel

MongoDB Starter – Developer Directory

A developer directory built on Next.js and MongoDB Atlas, deployed on Vercel with the Vercel + MongoDB integration.

Featured on the MongoDB World keynote.

Deployment Instructions

You will need to create a GitHub OAuth App to use this starter. Here are the steps:

  1. Go to https://github.com/settings/developers and create a new OAuth application

  2. Name your application "MongoDB Starter"

  3. Set the homepage URL to https://vercel.app for now (we'll change this later)

  4. Set the authorization callback URL to https://vercel.app/api/auth/callback/github for now (we'll change this later)

  5. Click "Register application".

  6. Once the application is created, copy the "Client ID". This will be your GITHUB_CLIENT_ID.

  7. Generate a new client secret and copy that too. This will be your GITHUB_CLIENT_SECRET.

  8. Generate a random secret here. This will be your NEXTAUTH_SECRET.

  9. Click on this button below to clone and deploy this template to Vercel.

  10. Once your application is deployed, edit the homepage & callback URLs in your GitHub OAuth App to match your deployment URL.

Note: Due to a bug, when deploying this application to Vercel, you'll need to go into your Vercel project's env vars page (https://vercel.com/<USERNAME/TEAM_SLUG>/<PROJECT_SLUG>/settings/environment-variables) and edit the MONGODB_URI string to replace the /admin part of the URL with ?retryWrites=true&w=majority. We will fix this soon.

Demo

https://mongodb.vercel.app

Vercel + MongoDB Integration

https://vercel.com/integrations/mongodbatlas

Tech Stack

MongoDB Starter

A developer directory built on Next.js and MongoDB Atlas.

Framework Next.js
Use Case Starter
CSS Tailwind
Database MongoDB
Auth NextAuth.js
Publisher ▲ Vercel

MongoDB Starter – Developer Directory

A developer directory built on Next.js and MongoDB Atlas, deployed on Vercel with the Vercel + MongoDB integration.

Featured on the MongoDB World keynote.

Deployment Instructions

You will need to create a GitHub OAuth App to use this starter. Here are the steps:

  1. Go to https://github.com/settings/developers and create a new OAuth application

  2. Name your application "MongoDB Starter"

  3. Set the homepage URL to https://vercel.app for now (we'll change this later)

  4. Set the authorization callback URL to https://vercel.app/api/auth/callback/github for now (we'll change this later)

  5. Click "Register application".

  6. Once the application is created, copy the "Client ID". This will be your GITHUB_CLIENT_ID.

  7. Generate a new client secret and copy that too. This will be your GITHUB_CLIENT_SECRET.

  8. Generate a random secret here. This will be your NEXTAUTH_SECRET.

  9. Click on this button below to clone and deploy this template to Vercel.

  10. Once your application is deployed, edit the homepage & callback URLs in your GitHub OAuth App to match your deployment URL.

Note: Due to a bug, when deploying this application to Vercel, you'll need to go into your Vercel project's env vars page (https://vercel.com/<USERNAME/TEAM_SLUG>/<PROJECT_SLUG>/settings/environment-variables) and edit the MONGODB_URI string to replace the /admin part of the URL with ?retryWrites=true&w=majority. We will fix this soon.

Demo

https://mongodb.vercel.app

Vercel + MongoDB Integration

https://vercel.com/integrations/mongodbatlas

Tech Stack

Unleash New Possibilities

Deploy your app on Vercel and unlock its full potential