Next.js + MongoDB
A guide to deploying a Next.js and Mongo application from GitHub.
Last updated
Was this helpful?
A guide to deploying a Next.js and Mongo application from GitHub.
Last updated
Was this helpful?
Deploy a Next.js and Mongo application and learn how to host backend code on Code Capsules.
Code Capsules connects to GitHub repositories to deploy applications. To follow this guide, you'll need a account and a account.
To demonstrate how to deploy a Next.js MongoDB application with Code Capsules, we've provided an example application, which you can find on the .
Sign in to GitHub, and fork the example application by clicking "Fork" at the top-right of your screen and selecting your GitHub account as the destination.
Log in to your Code Capsules account and navigate to the Spaces tab. Once there, click the yellow + icon on the bottom left of the screen to add a new Space.
Follow the prompts, choosing your region and giving your Space a name, then click "Create Space".
Example instructions to go with numbered annotations
Choose a Team — you can use a default "personal" Team if you're the only person working on this project, or a named Team if you're collaborating with others
This should remind you of the project, for example, "customer-api" or "notetaking-app"
Choose a country close to where most of your users will be
Navigate to the "Capsules" tab. Once there, click the yellow + icon on the bottom left of the screen to add a new Capsule.
To create a new Data Capsule for your Space, follow the instructions below:
Choose "MongoDB", your Team, and Space.
Choose your payment plan.
Click "Create Capsule".
Navigate to the Space containing your recently created Data Capsule and click the yellow + icon on the bottom left of the screen. Follow the instructions below to create a Backend Capsule:
Choose "Backend Capsule", your Team, and Space.
Choose your payment plan.
Click the GitHub button and give access to the repository you forked at the start of the tutorial.
Choose the GitHub repository you forked.
Press "Next".
Leave "Run Command" blank.
Click "Create Capsule".
Code Capsules will automatically build your application when you've finished creating the Capsule. While the build is in progress, you can view the log by clicking "View Build Progress" next to the "Building Capsule" message.
Once your application is live, you can view the build log by selecting the "Deploy" tab and clicking the "View build log" link in the "Builds" section.
After the two capsules have been successfully built, the next step is to connect them. To do this, navigate to the "Config" tab of your Backend Capsule. Scroll down to the "Data Capsule" section and click "View" to view the environment variables from the Data Capsule. Click the + next to the Connection string variable to create a DATABASE_URL environmental variable in your Backend Capsule, which gives access to services and features of your Data Capsule.
Once the build is complete, click the "URL" link in the "Config" tab, and you should see your deployed application.
A provides the server for hosting an application on Code Capsules.
If you’d like to deploy another application in a different language or framework, take a look at our other .
