Our great sponsors
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
// This approach is taken from https://github.com/vercel/next.js/tree/canary/examples/with-mongodb import { MongoClient } from 'mongodb'; const uri = process.env.MONGODB_URI; const options = { //useUnifiedTopology: true, //useNewUrlParser: true, }; let client: MongoClient; let clientPromise: Promise; if (!uri) { throw new Error('Please add your Mongo URI to .env.local'); } if (process.env.NODE_ENV === 'development') { // In development mode, use a global variable so that the value // is preserved across module reloads caused by HMR (Hot Module Replacement). if (!(global as any)._mongoClientPromise) { client = new MongoClient(uri, options); (global as any)._mongoClientPromise = client.connect(); } clientPromise = (global as any)._mongoClientPromise; } else { // In production mode, it's best to not use a global variable. client = new MongoClient(uri, options); clientPromise = client.connect(); } // Export a module-scoped MongoClient promise. By doing this in a // separate module, the client can be shared across functions. export default clientPromise; export async function getDb(dbName: string) { const client = await clientPromise; return client.db(dbName); }
The complete source code can be found on GitHub.
First, create a NextJS application. I'm using Typescript, but it is not required. You can use Javascript with minor changes. I'm also using yarn to manage dependencies, but you can use npm if you prefer. I will not cover npm syntax though.