Deploy Node/React/Next.js application to Azure App Service

 To deploy your Next.js dashboard (with App Router) to Azure App Service, follow these steps. 

Azure supports Next.js out-of-the-box with static and server-rendered content, including middleware.

microsoft/copilot-metrics-dashboard

>>C:\copilot-metrics-dashboard\src\dashboard>

1. Prepare Your App for Azure, Ensure your app is ready:

package.json must have a build and start script:

{

  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  }
}

You're using App Router (e.g., app/page.tsx), so next build will generate both static and server-rendered routes.

2. Create Production Build (Locally or via CI), run through VSC

npm install

npm run build

npm start - This confirms your app runs as a production server with next start.

Make sure the build completes successfully.

Install Docker CLI on Windows

 

Step-by-Step: Install Docker CLI on Windows

1. Download the Docker CLI Binary

• Visit the official Docker static binaries repository:

  https://download.docker.com/win/static/stable/x86_64/

• Download the latest .zip archive, for example: docker-28.3.0.zip

2. Extract the Archive

• Extract the contents of the .zip file to a directory of your choice, such as: C:\Tools\DockerCLI

• Inside this directory, you should find the docker.exe file.

3. Add Docker CLI to System PATH

• Open PowerShell as Administrator and run the following command to add the directory to your system's PATH:

  [System.Environment]::SetEnvironmentVariable("Path", $env:Path + ";C:\Tools\DockerCLI", [System.EnvironmentVariableTarget]::Machine)
  

  Replace C:\Tools\DockerCLI with the path where you extracted docker.exe.

• Restart your terminal to apply the changes.

4. Verify the Installation

• Open a new PowerShell or Command Prompt and run: docker version

  You should see output similar to:

  Client: Docker CLI