Skip to main content
The MilesONerd website uses GitHub Actions for automated deployment and maintenance, with GitHub Pages serving as the hosting platform.

​
Overview

GitHub Actions

Three automated workflows handle deployment, containerization, and maintenance tasks without manual intervention.

GitHub Pages

Static site hosting directly from the repository with custom CORS configuration and automatic HTTPS.

​
Deployment Workflow

The main deployment workflow deploys the site to GitHub Pages whenever changes are pushed to the update-urls branch.

​
Configuration

File: .github/workflows/deploy.yml 
name: Deploy to GitHub Pages

on:
  push:
    branches:
      - update-urls

jobs:
  deploy:
    runs-on: ubuntu-22.04

    steps:
    - name: Checkout the repository
      uses: actions/checkout@v3

    - name: Deploy to GitHub Pages
      uses: peaceiris/actions-gh-pages@v3
      with:
        github_token: ${{ secrets.CORS_ACCESS_TOKEN }}
        publish_dir: ./dist

    - name: Add CORS headers
      run: |
        echo "/*" >> dist/_headers
        echo "  Access-Control-Allow-Origin: *" >> dist/_headers
        echo "  Content-Type: application/json" >> dist/_headers

​
Workflow Steps

1

Trigger on Push

The workflow automatically triggers when code is pushed to the update-urls branch, ensuring only tested changes are deployed.
2

Repository Checkout

Uses actions/checkout@v3 to clone the repository with full git history for accurate deployment.
3

Deploy to Pages

The peaceiris/actions-gh-pages@v3 action publishes the ./dist directory to the gh-pages branch using a custom access token.
4

CORS Headers

Appends Cross-Origin Resource Sharing (CORS) headers to the _headers file, allowing API access from any origin.
The workflow uses Ubuntu 22.04 LTS as the runner environment, providing a stable and secure build platform.

​
CORS Configuration

The deployment includes automatic CORS header configuration to support the blog’s GitHub API integration.

​
Headers File

File: dist/_headers 
/*
  Access-Control-Allow-Origin: *
  Content-Type: application/json
The /* pattern applies these headers to all routes on the site. The wildcard origin (*) is necessary for the blog system to fetch Markdown files from the GitHub API.

​
Why CORS Matters

The blog system (old/blog/scripts/list-posts.js) makes client-side requests to the GitHub API: 
const url = `https://api.github.com/repos/${username}/${repo}/contents/old/blog/${folder}?ref=${branch}`;
const response = await fetch(url);
Without proper CORS headers, browsers would block these cross-origin requests, breaking the blog functionality. An automated workflow updates copyright years across all HTML files annually.

​
Configuration

File: .github/workflows/update-copyright.yml 
name: Update Copyright

on:
  schedule:
    - cron: "0 0 1 1 *" 

jobs:
  update-copyright:
    runs-on: ubuntu-latest

    steps:
      - name: Repository checkout
        uses: actions/checkout@v3

      - name: Update Copyright in HTML files
        run: |
          current_year=$(date +%Y)
          find . -name "*.html" -exec sed -i "s/Copyright © 2024-[0-9]*/Copyright © 2024-${current_year}/g" {} +
          git config --global user.name "Enzo Fuke"
          git config --global user.email "150525657+MilesONerd@users.noreply.github.com"
          git add .
          git commit -m "Updating Copyright to 2024-${current_year}"
          git push

​
How It Works

The cron expression 0 0 1 1 * runs the workflow at midnight UTC on January 1st every year.
  • Minute: 0
  • Hour: 0 (midnight)
  • Day: 1 (first day)
  • Month: 1 (January)
  • Day of week: * (any)
After updating all files, the workflow:
  1. Configures git with Enzo Fuke’s name and noreply email
  2. Stages all changed files
  3. Creates a commit with descriptive message
  4. Pushes changes back to the repository
This ensures copyright notices stay current without manual intervention.
The workflow uses the GitHub Actions bot’s credentials to push changes, which doesn’t require additional authentication tokens.

​
Docker Workflow

A third workflow handles Docker containerization (specific configuration not shown in provided files). File: .github/workflows/docker.yaml
This workflow likely builds and publishes a Docker image of the website, enabling containerized deployment options beyond GitHub Pages.

​
Deployment Architecture

1

Code Push

Developer pushes changes to the update-urls branch
2

Workflow Trigger

GitHub Actions automatically starts the deployment workflow
3

Build Process

Repository is checked out and CORS headers are configured
4

Publication

The ./dist directory is published to the gh-pages branch
5

Live Deployment

GitHub Pages serves the updated site at milesonerd.github.io

​
Secrets and Authentication

The deployment workflow uses a custom GitHub token stored in repository secrets: 
github_token: ${{ secrets.CORS_ACCESS_TOKEN }}
The CORS_ACCESS_TOKEN secret must have appropriate permissions to push to the gh-pages branch. Without this token, automated deployment will fail.

​
Required Token Permissions

The access token should have:
  • Contents: Read and write access
  • Workflows: Read and write access (for workflow files)
  • Pages: Write access for GitHub Pages deployment

​
Publish Directory

The deployment publishes from the ./dist directory: 
publish_dir: ./dist
This directory should contain:
  • All static HTML files
  • Assets (images, scripts, styles)
  • Configuration files (_headers, robots.txt)
Only files in the ./dist directory are deployed to GitHub Pages. Ensure all necessary files are present before pushing to the update-urls branch.

​
Monitoring and Troubleshooting

​
Viewing Workflow Runs

Monitor deployment status in the GitHub Actions tab:
  1. Navigate to the repository on GitHub
  2. Click the “Actions” tab
  3. Select the workflow run to view logs

​
Common Issues

Deployment Failure

Check that CORS_ACCESS_TOKEN is correctly configured and has proper permissions.

CORS Errors

Verify the _headers file exists in ./dist and contains proper CORS directives.

Copyright Not Updating

Ensure the workflow has push permissions and the cron schedule is correct.

Missing Files

Confirm all files are in ./dist before the workflow publishes to gh-pages.
Enable workflow notifications in repository settings to receive alerts when deployments succeed or fail.

Build docs developers (and LLMs) love

Get started for freeTalk to us