Netlify Deployment

Deploying with Netlify

Configuration with netlify.toml

Configure your Netlify deployment settings:

# netlify.toml
[build]
  command = "npm run build"
  publish = "dist"
  
[build.environment]
  NODE_VERSION = "18"

# Redirect all 404s to index.html for SPA routing
[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

GitHub Actions Integration

Automate deployments with GitHub Actions:

# .github/workflows/deploy.yml
name: Deploy to Netlify
on:
  push:
    branches: [ main ]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      
      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '18'
          
      - name: Install dependencies
        run: npm ci
        
      - name: Build site
        run: npm run build
        
      - name: Deploy to Netlify
        uses: nwtgck/actions-netlify@v2
        with:
          publish-dir: './dist'
          production-branch: main
          github-token: ${{ secrets.GITHUB_TOKEN }}
          deploy-message: "Deploy from GitHub Actions"
        env:
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}

Environment Variables

Manage sensitive data and configuration:

# .env
API_KEY=your_api_key_here
API_URL=https://api.example.com

# Access in your code
const apiKey = import.meta.env.API_KEY
const apiUrl = import.meta.env.API_URL

Deployment Methods

Manual drag-and-drop deployment
Git-based continuous deployment
CLI deployment with netlify-cli
API-driven deployment

Best Practices

Use environment variables for sensitive data
Configure proper build settings
Set up proper redirects for SPAs
Enable HTTPS by default
Configure custom domains properly
Use deploy previews for pull requests
Monitor deploy status and logs