Skip to content

Deploy to GitHub Pages #20

Deploy to GitHub Pages

Deploy to GitHub Pages #20

name: Deploy to GitHub Pages
# Task 2.1: Trigger using workflow_run to wait for CI completion
# Pattern: workflow_run event ensures deployment only runs after CI passes
# Research: Task 1.3 confirmed needs: [ci] doesn't work across workflow files
on:
workflow_run:
workflows: ['CI'] # Must match name in .github/workflows/ci.yml
types:
- completed
branches:
- main
# Top-level permissions for safety (deploy job has its own)
# Pattern from: .github/workflows/ci.yml:9-11
permissions:
actions: read
contents: read
# Task 2.2: Concurrency control prevents race conditions when multiple commits pushed rapidly
# Pattern from: .github/workflows/publish.yml:18-20
# cancel-in-progress: false ensures in-flight deployments complete
concurrency:
group: github-pages-${{ github.ref }}
cancel-in-progress: false
jobs:
deploy:
name: Deploy to GitHub Pages
runs-on: ubuntu-latest
# Task 2.3: Only run if CI workflow succeeded (quality gate)
# If CI failed, this workflow won't deploy (quality gate)
if: ${{ github.event.workflow_run.conclusion == 'success' }}
# Task 2.2: Environment configuration for GitHub Pages
# Tracks deployment in GitHub UI and provides URL output
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
# Task 2.2: Minimal permissions for deployment (job-level scoping)
# Pattern requirement: task-description.md:74-78
permissions:
pages: write # Deploy to GitHub Pages
id-token: write # OIDC authentication with GitHub Pages
steps:
# Task 2.4: Step 1 - Checkout repository code
# Pattern from: .github/workflows/ci.yml:17-20
- name: Checkout repository
uses: actions/checkout@v4
with:
fetch-depth: 0 # Full history for potential Nx affected commands
# Task 2.4: Step 2 - Setup Node.js with npm caching
# Pattern from: .github/workflows/ci.yml:29-32
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 20
cache: 'npm'
# Task 2.4: Step 3 - Install dependencies reproducibly
# Pattern from: .github/workflows/ci.yml:34
- name: Install dependencies
run: npm ci
# Task 2.4: Step 4 - Build application with GitHub Pages configuration
# CRITICAL: --base-href MUST be /angular-3d/ for correct asset paths
# Pattern requirement: task-description.md:44-49
# Verified locally in Task 1.2
- name: Build demo application for GitHub Pages
run: |
npx nx build angular-3d-demo \
--configuration=production \
--base-href=/angular-3d/
env:
NODE_ENV: production
# Task 2.4: Step 5 - Upload build artifacts to GitHub Pages
# Pattern requirement: task-description.md:59-65
# CRITICAL: Path MUST be dist/apps/angular-3d-demo/browser (Angular output folder)
- name: Upload GitHub Pages artifact
uses: actions/upload-pages-artifact@v3
with:
path: dist/apps/angular-3d-demo/browser
# Task 2.5: Step 6 - Deploy to GitHub Pages
# Pattern requirement: task-description.md:62-63
# Uses official GitHub Pages deployment action
# Automatically receives artifact from upload step
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages@v4
# Task 2.5: Step 7 - Output deployment URL for easy access
- name: Display deployment URL
run: |
echo "🚀 Deployment complete!"
echo "📍 Application accessible at: ${{ steps.deployment.outputs.page_url }}"
echo "⏱️ CDN propagation may take 1-2 minutes"