Deploy a Next.js (Miro) app to Microsoft Azure w/ Env Variables

The main steps I will take is to demo the app, then go into Azure, then create a GitHub repo we want to deploy. Next we will Create a new Static Web App and configure my GitHub account to choose the repo I want to deploy.

Next, I create a Miro app and set the deployment URL as well as the redirect URL.

Next, I go into my deployed Azure app and configure the environmental variables to use the same redirectURL I chose in Miro, as well as set my ClientID and ClientSecret to point to the Miro app I created. That's pretty much it! I then test the app to make sure it works.

00:00 - Intro
00:13 - Deployed App Demo
01:34 - Azure intro
01:52 - Create GitHub repo for app
02:46 - Create new Static Web App
03:26 - Create new Static Web App - GitHub repo details
03:50 - Create new Static Web App - Build Presets
04:55 - Create Miro App (NextJS OAuth example app) details
05:20 - Edit Miro App Manifest to add Azure App URL
05:50 - Understanding the app code (and env varibles)
06:30 - Add Env Variables in Azure App Configuration page
07:25 - Test Deployed App
07:53 - Outro

[kodeup]

This is just amazing. I would like to see how to deploy a nextjs app on top of nextjs in azure app service.

[jonosuav]

Would love to see how to do this deploying a NextJS Azure container app. That would be super valuable.

[borsaniasushant]

Is there a way to add those environment variables programmatically?

[alaeddinemenai]

The challenge I face how to access these env variables from Docker?

[mbuzogan]

great video, it helps a lot, thank you
but I have a question, I have read quite a lot of comments on redit recommending using app service instead, is this still true? or is a static web app ready for Next.js 15?

[KKJJJJJ]

for dynamic route it's not working