How to Integrate MongoDB with V0

MongoDB Atlas is the managed cloud version of MongoDB and the recommended way to use MongoDB with Vercel. The free M0 tier provides 512MB of storage — enough for most early-stage apps — with no credit card required. Creating a cluster takes about 5 minutes. Go to cloud.mongodb.com and create a free account if you do not have one. Click Build a Database → Create → select M0 (Free) tier → choose a cloud provider and region close to your Vercel deployment region (for lowest latency, choose the same region if possible) → click Create. While the cluster is provisioning, create a database user: in the Security section on the left, click Database Access → Add New Database User. Set a username and a strong password, give it Read and Write access to any database, and save. Next, configure Network Access. This is a critical step for Vercel compatibility. In the Security section, click Network Access → Add IP Address. Vercel's serverless functions run on dynamic IP addresses that change with each deployment and each function invocation — there is no fixed IP range to whitelist. The solution is to allow all IPs by clicking Allow Access from Anywhere, which sets the CIDR to 0.0.0.0/0. This is safe when combined with strong database user credentials because MongoDB Atlas still requires username/password authentication for every connection. Do not skip this step — a network access list that only includes your home IP address will cause all production requests from Vercel to fail with a connection timeout. Once your cluster is ready, click Connect → Drivers → Node.js and copy the connection string. Replace <password> in the string with your database user's actual password. The connection string looks like: mongodb+srv://username:password@cluster0.xxxxx.mongodb.net/. Store this entire string — you will add it to your Vercel environment variables in the next step.

Install the official MongoDB Node.js driver by adding it to your project. Add mongodb to your package.json dependencies. This package provides the MongoClient class that connects to Atlas and all the query methods for inserting, finding, updating, and deleting documents. The most important architectural decision when using MongoDB with Vercel's serverless functions is connection caching. Each Vercel serverless function invocation can spin up a new process — without caching, each invocation would create a new MongoDB connection, quickly exhausting Atlas's connection limit (even the M0 free tier allows 500 concurrent connections, but cold starts can create connection spikes). The solution is to store the MongoClient promise in a module-level variable that persists across multiple function invocations within the same Vercel worker process. Create a utility file at lib/mongodb.ts that exports a clientPromise — a promise that resolves to a connected MongoClient. In development, use a global variable to prevent hot module replacement from creating multiple connections during development. In production, the module-level variable serves the same purpose within a single worker instance. This pattern is recommended in the official Next.js MongoDB example and is battle-tested for Vercel deployments. Every API route that needs MongoDB will import this clientPromise and call await clientPromise to get the connected client, then call client.db(dbName) to access a specific database.

1// lib/mongodb.ts
2import { MongoClient, MongoClientOptions } from 'mongodb'
3
4const uri = process.env.MONGODB_URI
5
6if (!uri) {
7  throw new Error('MONGODB_URI environment variable is not defined')
8}
9
10const options: MongoClientOptions = {}
11
12let client: MongoClient
13let clientPromise: Promise<MongoClient>
14
15if (process.env.NODE_ENV === 'development') {
16  // In development, use a global variable to preserve the connection
17  // across hot module replacements to avoid exhausting connections
18  const globalWithMongo = global as typeof globalThis & {
19    _mongoClientPromise?: Promise<MongoClient>
20  }
21
22  if (!globalWithMongo._mongoClientPromise) {
23    client = new MongoClient(uri, options)
24    globalWithMongo._mongoClientPromise = client.connect()
25  }
26  clientPromise = globalWithMongo._mongoClientPromise
27} else {
28  // In production, use a module-level variable for connection caching
29  client = new MongoClient(uri, options)
30  clientPromise = client.connect()
31}
32
33export default clientPromise

With the MongoDB client utility in place, create API routes that perform the actual database operations your app needs. Each resource in your app (users, posts, products, etc.) gets its own API route file. The route imports clientPromise from lib/mongodb.ts, awaits the connection, selects the database and collection, and runs the appropriate MongoDB query based on the HTTP method. The standard pattern is: GET requests query the collection (find or findOne), POST requests insert new documents, PUT/PATCH requests update existing documents, and DELETE requests remove documents. Each operation uses the MongoDB Node.js driver's fluent API — collection.find(), collection.insertOne(), collection.updateOne(), collection.deleteOne(). For collections that will grow large, always add query filters rather than fetching all documents. Use collection.find({ status: 'active' }) rather than collection.find({}), add limit() to cap result sets, and add sort() to control ordering. For production apps with high query volume, add MongoDB Atlas indexes on the fields you filter and sort by — an index on a frequently queried field can reduce query time from seconds to milliseconds. You can create indexes through the Atlas console's Collections view or programmatically using collection.createIndex(). For complex integrations or when you need help setting up optimal indexes and aggregation pipelines for your specific data model, RapidDev's team can review your MongoDB schema and query patterns to ensure your app performs well at scale.

1// app/api/records/route.ts
2import { NextRequest, NextResponse } from 'next/server'
3import clientPromise from '@/lib/mongodb'
4
5const DB_NAME = process.env.MONGODB_DB_NAME ?? 'myapp'
6const COLLECTION = 'records'
7
8export async function GET(request: NextRequest) {
9  try {
10    const client = await clientPromise
11    const db = client.db(DB_NAME)
12    const collection = db.collection(COLLECTION)
13
14    const { searchParams } = new URL(request.url)
15    const status = searchParams.get('status')
16    const limit = parseInt(searchParams.get('limit') ?? '50', 10)
17
18    const filter = status ? { status } : {}
19
20    const records = await collection
21      .find(filter)
22      .sort({ createdAt: -1 })
23      .limit(limit)
24      .toArray()
25
26    // Convert MongoDB ObjectId to string for JSON serialization
27    const serialized = records.map((doc) => ({
28      ...doc,
29      _id: doc._id.toString(),
30    }))
31
32    return NextResponse.json({ records: serialized })
33  } catch (error) {
34    console.error('MongoDB GET error:', error)
35    return NextResponse.json(
36      { error: 'Failed to fetch records' },
37      { status: 500 }
38    )
39  }
40}
41
42export async function POST(request: NextRequest) {
43  try {
44    const client = await clientPromise
45    const db = client.db(DB_NAME)
46    const collection = db.collection(COLLECTION)
47
48    const body = await request.json()
49
50    if (!body.name) {
51      return NextResponse.json(
52        { error: 'name is required' },
53        { status: 400 }
54      )
55    }
56
57    const now = new Date()
58    const result = await collection.insertOne({
59      ...body,
60      createdAt: now,
61      updatedAt: now,
62    })
63
64    return NextResponse.json(
65      {
66        success: true,
67        id: result.insertedId.toString(),
68      },
69      { status: 201 }
70    )
71  } catch (error) {
72    console.error('MongoDB POST error:', error)
73    return NextResponse.json(
74      { error: 'Failed to create record' },
75      { status: 500 }
76    )
77  }
78}

Complete your CRUD API by adding update and delete endpoints. These use dynamic route segments — app/api/records/[id]/route.ts — where [id] maps to the document's MongoDB ObjectId string. The route converts the string ID back to a MongoDB ObjectId using the ObjectId class from the mongodb package before running database operations. The PUT handler reads the document ID from params.id, converts it to ObjectId, and calls collection.updateOne() with a filter matching that _id and an $set update operator containing the new field values. Always include an updatedAt timestamp in your $set operation to track when documents were last modified — this is important for any admin interface that shows 'last updated' information. The DELETE handler follows the same pattern: convert params.id to ObjectId, call collection.deleteOne() with the matching filter, and return a success response. For data integrity, consider implementing soft deletes instead of hard deletes — rather than removing the document, set a deletedAt timestamp and filter it out of GET queries. This preserves historical data and makes accidental deletions recoverable. The trade-off is slightly more complex queries; for most early-stage apps, hard deletes are simpler and fine.

1// app/api/records/[id]/route.ts
2import { NextRequest, NextResponse } from 'next/server'
3import { ObjectId } from 'mongodb'
4import clientPromise from '@/lib/mongodb'
5
6const DB_NAME = process.env.MONGODB_DB_NAME ?? 'myapp'
7const COLLECTION = 'records'
8
9function parseObjectId(id: string) {
10  try {
11    return new ObjectId(id)
12  } catch {
13    return null
14  }
15}
16
17export async function GET(
18  request: NextRequest,
19  { params }: { params: { id: string } }
20) {
21  const objectId = parseObjectId(params.id)
22  if (!objectId) {
23    return NextResponse.json({ error: 'Invalid ID' }, { status: 400 })
24  }
25
26  try {
27    const client = await clientPromise
28    const db = client.db(DB_NAME)
29    const doc = await db.collection(COLLECTION).findOne({ _id: objectId })
30
31    if (!doc) {
32      return NextResponse.json({ error: 'Not found' }, { status: 404 })
33    }
34
35    return NextResponse.json({ ...doc, _id: doc._id.toString() })
36  } catch (error) {
37    console.error('MongoDB GET [id] error:', error)
38    return NextResponse.json({ error: 'Failed to fetch record' }, { status: 500 })
39  }
40}
41
42export async function PUT(
43  request: NextRequest,
44  { params }: { params: { id: string } }
45) {
46  const objectId = parseObjectId(params.id)
47  if (!objectId) {
48    return NextResponse.json({ error: 'Invalid ID' }, { status: 400 })
49  }
50
51  try {
52    const client = await clientPromise
53    const db = client.db(DB_NAME)
54    const body = await request.json()
55
56    // Remove _id from body to prevent overwriting the immutable _id field
57    const { _id, createdAt, ...updateFields } = body
58
59    const result = await db.collection(COLLECTION).updateOne(
60      { _id: objectId },
61      {
62        $set: {
63          ...updateFields,
64          updatedAt: new Date(),
65        },
66      }
67    )
68
69    if (result.matchedCount === 0) {
70      return NextResponse.json({ error: 'Not found' }, { status: 404 })
71    }
72
73    return NextResponse.json({ success: true })
74  } catch (error) {
75    console.error('MongoDB PUT error:', error)
76    return NextResponse.json({ error: 'Failed to update record' }, { status: 500 })
77  }
78}
79
80export async function DELETE(
81  request: NextRequest,
82  { params }: { params: { id: string } }
83) {
84  const objectId = parseObjectId(params.id)
85  if (!objectId) {
86    return NextResponse.json({ error: 'Invalid ID' }, { status: 400 })
87  }
88
89  try {
90    const client = await clientPromise
91    const db = client.db(DB_NAME)
92
93    const result = await db.collection(COLLECTION).deleteOne({ _id: objectId })
94
95    if (result.deletedCount === 0) {
96      return NextResponse.json({ error: 'Not found' }, { status: 404 })
97    }
98
99    return NextResponse.json({ success: true })
100  } catch (error) {
101    console.error('MongoDB DELETE error:', error)
102    return NextResponse.json({ error: 'Failed to delete record' }, { status: 500 })
103  }
104}

Your API routes use process.env.MONGODB_URI for the Atlas connection string. This variable must be configured in Vercel for production deployments and in .env.local for local development. The connection string contains your database username and password, so it is a secret that must never be committed to Git. In Vercel, navigate to vercel.com/dashboard → select your project → Settings → Environment Variables. Click Add Variable. Set the Key to MONGODB_URI and the Value to your full Atlas connection string, including the database user's password (the string that starts with mongodb+srv://). Set it to all three environments: Production, Preview, and Development. Click Save. Optionally add MONGODB_DB_NAME with the name of your primary database (e.g., myapp or production). If you do not set this variable, the routes default to 'myapp' as the database name. For local development, add both variables to your .env.local file. Make sure .env.local is in your .gitignore — Next.js projects include it by default, but double-check before committing. After adding the environment variables, push a commit to GitHub to trigger a new Vercel deployment. Once deployed, test all four CRUD operations through your production URL to confirm the connection to Atlas is working. Check the Atlas cluster's monitoring tab to see connections appearing when your API routes run — you should see the connection count spike briefly when the first request comes in, then stabilize as the cached connection is reused.

1# .env.local (for local development only — never commit this file)
2MONGODB_URI=mongodb+srv://username:password@cluster0.xxxxx.mongodb.net/
3MONGODB_DB_NAME=myapp
4
5# MONGODB_URI is server-side only — do NOT use NEXT_PUBLIC_ prefix