According to the screenshot provided in the question, you seem to be stuck at `Microsoft.Web/serverfarms`due to`BadGateway`.
- This could be due to a backend delay in enabling the `Microsoft.Web` resource provider.
- Retry creating the App Service after few hours.
Configure the GitHub deployment during App Service creation.
- Duration creation of NodeJS App Service, navigate to `Deployment section=> enable Continuous Deployment=>Select GitHub repository of react project`
`Enable Basic Authentication` and Review+create.
- This creates the workflow to deploy the app to Azure using GitHub actions.
**My Workflow:**
```yml
name: Build and deploy Node.js app to Azure Web App - <appname>
on:
push:
branches:
- main
workflow_dispatch:
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Set up Node.js version
uses: actions/setup-node@v3
with:
node-version: '20.x'
- name: npm install, build, and test
run: |
npm install
npm run build --if-present
npm run test --if-present
- name: Zip artifact for deployment
run: zip release.zip ./* -r
- name: Upload artifact for deployment job
uses: actions/upload-artifact@v3
with:
name: node-app
path: release.zip
deploy:
runs-on: ubuntu-latest
needs: build
environment:
name: 'Production'
url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
steps:
- name: Download artifact from build job
uses: actions/download-artifact@v3
with:
name: node-app
- name: Unzip artifact for deployment
run: unzip release.zip
- name: 'Deploy to Azure Web App'
id: deploy-to-webapp
uses: azure/webapps-deploy@v2
with:
app-name: '<appname>'
slot-name: 'Production'
package: .
publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_3134D1CCXXXXFAC }}
```
- I have deployed the sample react app to Azure using GitHub actions.
**Portal:**
- Delete the **node_modules** folder and **package-lock.json**.
- Modify **Scripts** section in **Package.json** as below:
```json
{
"name": "appname",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"startAzure": "./node_modules/next/dist/bin/next start",
"lint": "next lint"
},
```
- If you are using **pm2**, change the startup script as below:
```json
module.exports = {
apps: [
{
name: "app-name",
script: "./node_modules/next/dist/bin/next",
args: "start -p " + (process.env.PORT || 3000),
watch: false,
autorestart: true,
},
],
};
```
- I have deployed a Nextjs application to Linux Azure App Service using GitHub actions.
```yml
name: Build and deploy Node.js app to Azure Web App - <appname>
on:
push:
branches:
- main
workflow_dispatch:
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Set up Node.js version
uses: actions/setup-node@v3
with:
node-version: '18.x'
- name: npm install, build, and test
run: |
npm install
npm run build --if-present
npm run test --if-present
- name: Zip artifact for deployment
run: zip release.zip ./* -r
- name: Upload artifact for deployment job
uses: actions/upload-artifact@v3
with:
name: node-app
path: release.zip
deploy:
runs-on: ubuntu-latest
needs: build
environment:
name: 'Production'
url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
steps:
- name: Download artifact from build job
uses: actions/download-artifact@v3
with:
name: node-app
- name: Unzip artifact for deployment
run: unzip release.zip
- name: 'Deploy to Azure Web App'
id: deploy-to-webapp
uses: azure/webapps-deploy@v2
with:
app-name: '<appname>'
slot-name: 'Production'
publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_0A66FXXXXXXX6F0738 }}
package: .
```
**Portal:**
**References:**
[node.js - How do I get my Next.js app to start in an Azure App Service running ubuntu-latest?](https://stackoverflow.com/questions/72258454/how-do-i-get-my-next-js-app-to-start-in-an-azure-app-service-running-ubuntu-late)
