Getting Started with MongoDB Atlas, NodeJS, and Azure App Service
Rate this tutorial
and Azure are great friends! In fact, they became even better friends recently with the addition of the MongoDB Atlas Pay-as-You-Go Software as a Service (SaaS) subscription to the , allowing you to use your existing Azure credits to enjoy all the benefits of the MongoDB Atlas Developer Data Platform. So there is no better time to learn how you can take advantage of both of these.
There are a few things you will need in place in order to follow this article.
MongoDB Atlas comes with database level security out of the box. This includes not only the users who can connect but also where you can connect from. For this reason, you will need to configure network access rules for who or what can access your applications.
- MongoDB: a general-purpose document database
- Express: Node.js web framework
So we have the pieces in place we need, including a place to store data and an awesome MERN stack repo ready to go. Now we need to create our Azure App Service instance so we can take advantage of its deployment and hosting capabilities:
- Click Create to trigger the creation wizard.
- Enter the following information:
- Subscription: Choose your preferred existing subscription. Note: When you first create an account, you are given a free trial subscription with $150 free credits you can use
- Resource Group: Use an existing or click the Create new link underneath the box to create a new one.
- Name: Choose what you would like to call it. The name has to be unique as it is used to create a URL ending .azurewebsites.net but otherwise, the choice is yours.
- Publish: Code.
- Runtime stack: Node 18 LTS.-
- OS: Linux.
- Region: Pick the one closest to you.
- Pricing Plans: F1 - this is the free version.
- Once you are happy, select Review + create in the bottom left.
- Click Create in the bottom left and await deployment.
- Once created, it will allow you to navigate to your new app service so we can start configuring it.
Now that we have App Service set up, we need to add our connection string to our MongoDB Atlas cluster to app settings, so when deployed the application will be able to find the value and connect successfully.
- From the left-side menu in the Azure Portal inside your newly created App Service, click Configuration under the Settings section.
- We then need to add a new value in the Application Settings section. NOT the Connection String section, despite the name. Click the New application setting button under this section to add one.
- Add the following values:
We have our application, we have our app service and we have our connection string stored. Now it is time to link to our GitHub repo to take advantage of CI/CD goodness in Azure App Services.
- Inside your app service app, click Deployment Center on the left in the Deployment section.
- In the Settings tab that opens by default, from Source, select GitHub.
- Fill out the boxes under the GitHub section that appears to select the main branch of your fork of the MERN stack repo.
- Under Workflow Option: Make sure Add a workflow is the selected option.
- Click Save at the top.
This will trigger a GitHub Actions build. If you view this in GitHub, you will see it will fail because we need to make some changes to the YAML file it created to allow it to build and deploy successfully.
Now that we have connected GitHub Actions and App Services, there is a new folder in the GitHub repo called .github with a subfolder called workflows. This is where you will find the yaml files that App Services auto generated for us in the last section.
However, as mentioned, we need to adjust it slightly to work for us:
- In the jobs section, there will be a sub section for the build job. Inside this we need to replace the whole steps section with the code found in
- N.B. The reason it is in a Gist is because indentation is really crucial in YAML and this makes sure the layout stays as it should be to make your life easier.
- As part of this, we have named our app ‘mern-app’ so we need to make sure this matches in the deploy step. Further down in the jobs section of the yaml file, you will find the deploy section and its own steps subsection. In the first name step, you will see a bit where it says node-app. Change this to mern-app. This associates the build and deploy apps.
That’s it! All you need to do now is commit the changes to the file. This will trigger a run of the GitHub Action workflow. Once it builds successfully, you can go ahead and visit your website.
To find the URL of your website, visit the project inside the Azure Portal and in the Overview section you will find the link.
You should now have a working NodeJS application that uses MongoDB Atlas that is deployed to Azure App Services.
You are now well on your way to success with Azure App Services, NodeJS and MongoDB Atlas!
In this article, we created an Azure App Service, added our connection string inside Azure and then linked it up to our existing MERN stack example repo in GitHub, before customizing the generated workflow file for our application. Super simple and shows what can be done with the power of the cloud and MongoDB’s Developer Data Platform!
Delivering a Near Real-Time Single View into Customers with a Federated Database
Jun 28, 2023