About

May 20, 2026 · View on GitHub

Personal blog generated by jekyll on github pages

alexanderle.com

Tech Stack

  • Jekyll 4.4.1 - Static site generator
  • GitHub Pages - Hosting and deployment
  • SCSS/Sass - CSS preprocessing
  • Markdown - Content authoring
  • HTMLHint & Stylelint - Code quality
  • Google Analytics - Traffic tracking
  • GitHub Actions - Automated workflows

Development

Prerequisites

  • Ruby 2.7+ (recommend 3.x via Homebrew: brew install ruby)
  • Node.js and npm

Local Setup

# Install Ruby dependencies
bundle install

# Install Node dependencies
npm install

Running Locally

# Start local server with drafts (http://127.0.0.1:4000)
bundle exec jekyll serve --drafts

# Or use npm script
npm run jekyll:serve

# Build site without serving
bundle exec jekyll build

# With app secrets (e.g. Café au Le notifications)
bundle exec jekyll serve --config _config.yml,_config_secrets.yml --drafts

Linting

SCSS linting runs automatically via pre-commit hook.

  • npm run lint - Run SCSS linting
  • npm run lint:fix - Auto-fix SCSS issues

Configuration: .stylelintrc.json

Pre-commit Hooks

Automated code quality checks run before each commit via Husky (.husky/pre-commit):

  • SCSS linting
  • Post filename validation (kebab-case, only when _posts/ files are staged)

Post filenames must follow the format: YYYY-MM-DD-kebab-case-title.markdown

Commands:

  • npm run prepare - Reinstall Husky hooks after changes
  • --no-verify flag - Skip hooks temporarily

Mobile Blogging

Create blog posts from anywhere using GitHub Issues:

  1. Create a new issue (from phone or desktop):

    • Title: Your post title
    • Body: Your post content in markdown
    • Optional: Include Tags: tag1, tag2 on its own line

  2. Publish immediately — add the new-post label:

    • Workflow creates a formatted post in _posts/YYYY/
    • Issue is closed with a link to the published post

  3. Save as draft — add the draft label:

    • Workflow saves to _drafts/
    • Issue stays open with the filename noted
    • Preview locally with bundle exec jekyll serve --drafts

  4. Publish a draft — add the publish label to the same issue:

    • Workflow moves the file from _drafts/ to _posts/YYYY/
    • Issue is closed with a link to the live post

  5. Edit existing posts:

    • Navigate to _posts folder in GitHub and edit directly

Image Optimization

Images are automatically optimized when added or modified in the repository:

  1. How it works:

    • GitHub Actions workflow runs whenever images are added or modified
    • Uses the Calibre image optimization engine to compress images
    • JPEG and PNG files are compressed to 80% quality (good balance of size/quality)
    • Optimized images are automatically committed back to the repository

  2. Adding images:

    • Place images in the assets folder
    • Reference in posts using markdown: ![Alt text](/assets/image.jpg)
    • Optimization happens automatically on commit

  3. Manual optimization:

    • You can manually trigger optimization by running the workflow from the Actions tab
    • Select the "optimize-images" workflow and click "Run workflow"

Broken links are automatically checked:

  • Runs weekly (Sundays at midnight)
  • Runs on pushes to main that modify posts or pages
  • Creates a GitHub issue if broken links are found

Apps

Interactive tools at alexanderle.com/apps:

  • Café au Le - Order a fresh pourover from Alex's home bar (ntfy.sh push notifications)
  • Pace Calculator - Running pace, distance, and time calculator with VDOT race predictions
  • FIRE Calculator - Financial independence projections with asset allocation and withdrawal strategies
  • Regex Lab - Live regex matching with capture groups and quick reference
  • GitHub Stats - GitHub user profiles, language breakdown, and top repositories

Build Validation

Pull requests are automatically validated:

  • Jekyll build is tested on every PR
  • Ensures site builds successfully before merging