This site!

This is my personal blog and portfolio website built with Jekyll, a static site generator. The site serves as a technical blog covering web and mobile development with a focus on Ruby on Rails, while also showcasing case studies of various projects. The site is hosted on GitHub Pages and has been reskinned and improved several times over the last 15 years while retaining a full history of posts and pages.

Core Framework:

  • Jekyll - Static site generator
  • Liquid - Templating language
  • Pygments - Code highlighting

Frontend:

  • CSS3 with custom styling and Pico CSS framework (current iteration)
  • HTML5 with semantic markup

Development Tools:

  • Docker - Containerization for development environment
  • Make - Build automation
  • Git - Version control
  • GitHub Pages - Hosting platform

Key Dependencies:

  • jekyll-paginate - Blog pagination
  • jekyll-gist - GitHub Gist integration
  • jekyll-mentions - Social media mentions
  • jekyll-redirect-from - URL redirection

Development Timeline

Early Development (2010-2015):

  • Initial Jekyll setup with basic blog functionality
  • Custom plugin development for Gist integration
  • Sitemap generation implementation

Content Growth (2015-2020):

  • Extensive blog post collection (200+ posts)
  • Focus on Ruby on Rails and web development topics
  • Integration of analytics and performance optimizations

Recent Enhancements (2020-2025):

  • Docker containerization for development
  • Case study documentation system
  • Modern CSS framework integration (Pico CSS)
  • Performance optimizations (instant.page, optimized images)

Current State:

  • Active maintenance with regular content updates
  • Case study documentation for multiple projects
  • Modern responsive design with accessibility considerations

Architecture Patterns

Static Site Generation:

  • Jekyll-based static site with pre-built HTML
  • GitHub Pages hosting for zero-maintenance deployment
  • Optimized for performance and SEO

Content Organization:

  • Separation of blog posts and other content
  • YAML front matter for metadata management
  • Liquid templating for dynamic content generation

Custom Plugin Architecture:

  • Modular plugin system for extended functionality
  • GitHub Gist integration for code sharing
  • Automated sitemap generation

Responsive Design:

  • Mobile-first CSS approach
  • CSS Grid and Flexbox for layouts
  • Progressive enhancement principles

Development Workflow:

  • Docker containerization for consistent environments
  • Make-based build automation
  • Git-based version control with GitHub Pages integration

Challenges Faced

Content Management:

  • Managing 200+ blog posts with consistent formatting
  • Balancing technical depth with accessibility
  • Maintaining SEO optimization across extensive content

Performance Optimization:

  • Optimizing image delivery and caching without external services or dependencies
  • Implementing instant.page for faster navigation
  • Balancing feature richness with load times

Cross-Platform Compatibility:

  • Ensuring consistent rendering across browsers
  • Mobile responsiveness for various screen sizes
  • Accessibility compliance for diverse users

Development Environment:

  • Jekyll plugin maintenance and updates
  • Dependency management across Ruby versions

Content Organization:

  • Structuring content with consistent metadata
  • Managing multiple content types (posts, case studies, pages)
  • URL structure and redirect management

Technical Debt:

  • Legacy plugin maintenance
  • Ruby version compatibility
  • CSS framework integration and customization