1. 🚀 Create a staging Branch from main

Run the following in your local repo or directly on GitHub:

git checkout main
git pull
git checkout -b staging
git push origin staging

This will serve as your staging environment and deploy context.

2. 🤖 Auto-Sync staging from main using GitHub Actions

Create a GitHub Actions workflow to auto-update staging on every push to main.

➕ Add a GitHub Action File

Create a new workflow file at .github/workflows/sync-staging.yml:

name: Sync Main to Staging

on:
  push:
    branches:
      - main

jobs:
  sync:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout main
        uses: actions/checkout@v3
        with:
          ref: main
          fetch-depth: 0

      - name: Configure Git
        run: |
          git config user.name "github-actions[bot]"
          git config user.email "github-actions[bot]@users.noreply.github.com"

      - name: Push to staging
        run: |
          git push origin main:staging --force

⚠️ This force-pushes the contents of main into staging on every update. If you make direct edits on staging, they will be overwritten.

3. 🧪 Set Up Staging Environment Variables in Netlify

Add branch-deploy Environment Variables:

In Netlify Dashboard → Site Settings → Environment Variables, add under the branch-deploy context:

✅ Gatsby will now use the development dataset only when deploying the staging branch.

4. 🧪 Enable Branch Deploy for staging in Netlify

To allow Netlify to deploy the staging branch, follow these steps: