Abstract AI and machine learning visualization representing enterprise artificial intelligence solutions

Tutorial · 12 min

Deploy Next.js to Azure App Service

Step-by-step guide to deploying Next.js applications on Azure App Service with CI/CD.

Introduction

Azure App Service provides a managed platform for hosting Next.js applications with built-in scaling, SSL, and deployment slots.

Prerequisites

  • Azure subscription
  • Next.js project
  • Azure CLI installed

Step 1: Configure Next.js for Standalone Output

// next.config.ts
const nextConfig = {
  output: 'standalone',
};
export default nextConfig;

Step 2: Create App Service

az group create --name s2ftech-rg --location eastus
az appservice plan create --name s2ftech-plan --resource-group s2ftech-rg --sku B1 --is-linux
az webapp create --resource-group s2ftech-rg --plan s2ftech-plan --name my-nextjs-app --runtime "NODE:20-lts"

Step 3: GitHub Actions CI/CD

name: Deploy to Azure
on:
  push:
    branches: [main]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
      - run: npm ci && npm run build
      - uses: azure/webapps-deploy@v3
        with:
          app-name: my-nextjs-app
          publish-profile: ${{ secrets.AZURE_PUBLISH_PROFILE }}
          package: .

Conclusion

Azure App Service simplifies Next.js deployment with managed infrastructure and deployment slots for zero-downtime releases.

Ready to Build Your Next Digital Product?

Let's discuss your idea today. Partner with S2FTech for custom software development, AI, and cloud delivery.