↓ Skip to main content
Jeroen Tuijn - Portfolio

Why I Chose Hugo and Blowfish for My Portfolio

·760 words·4 mins
Jeroen Tuijn
Author
Jeroen Tuijn
Table of Contents
Sometimes the best choice is the simplest one - here’s why I went with Hugo and Blowfish

When it came time to build my personal portfolio, I had several options: React-based frameworks, WordPress, Webflow, or a traditional static site generator. After careful consideration, I chose Hugo with the Blowfish theme. Here’s why.

The Requirements
#

Before diving into the decision, let me share what I needed:

✅ Fast Performance - No one likes a slow website
✅ Easy Content Management - Markdown-based, version-controlled
✅ Customization - Ability to make it uniquely mine
✅ Low Maintenance - No database, no updates breaking things
✅ SEO Friendly - Good meta tags, sitemaps, structured data
✅ Cost Effective - Free hosting on Codeberg Pages
✅ Developer-Friendly - Fits naturally into my workflow

Why Hugo?
#

Blazing Fast Build Times
#

Hugo is written in Go, which makes it incredibly fast. My entire site builds in under a second:

$ hugo --timing
Total in 847 ms

Compare that to Jekyll (Ruby) or Gatsby (Node.js), which can take 10-30 seconds for similar-sized sites.

Simple Content Structure
#

Hugo uses plain Markdown files organized in a logical directory structure:

content/
├── _index.md
├── about/
│   └── index.md
├── projects/
│   └── my-project/
│       └── index.md
└── posts/
    └── my-article/
        └── index.md

No database, no complex CMS - just files I can edit in any text editor and version control with Git.

Zero Runtime Dependencies
#

Once Hugo builds the site, you get pure HTML, CSS, and JavaScript. No server-side processing, no database queries, no PHP execution. Just fast, static files.

Excellent Documentation
#

Hugo’s documentation is comprehensive and well-organized. I was productive within hours, not days.

Why Blowfish Theme?
#

Feature-Rich Out of the Box
#

Blowfish comes with features I’d otherwise have to build myself:

  • 🌓 Dark/Light Mode - Automatic with manual override
  • 📱 Responsive Design - Mobile-first approach
  • 🔍 Client-side Search - Fast, no server needed
  • 📊 Multiple Layout Options - Profile, hero, card, background
  • 🏷️ Taxonomies - Tags and categories
  • 📖 Table of Contents - Auto-generated for articles
  • ♿ Accessible - WCAG-compliant

Active Development
#

The theme is actively maintained with regular updates and improvements. The GitHub repository has a vibrant community.

Customization Flexibility
#

Blowfish follows Hugo’s template override convention. I can customize any part by creating matching files in my layouts/ directory:

layouts/
└── partials/
    └── head/
        └── custom.html  ← My custom meta tags

Performance Optimized
#

The theme automatically:

  • Optimizes images with Hugo Pipes
  • Minifies CSS/JS in production
  • Generates responsive image sizes
  • Implements lazy loading
  • Uses efficient fingerprinting

The Alternative I Considered
#

Next.js + MDX
#

Pros: More interactive features, React ecosystem
Cons: Overkill for a portfolio, complex deployment, larger bundle size

WordPress
#

Pros: Easy content editing, tons of themes
Cons: Security concerns, performance overhead, constant updates

Webflow
#

Pros: Visual editor, no coding required
Cons: Expensive, vendor lock-in, limited customization

Astro
#

Pros: Modern, fast, framework-agnostic
Cons: Younger ecosystem, fewer themes

My Setup
#

Here’s my current configuration:

# hugo.toml
baseURL = 'https://toulcit.codeberg.page/portfolio/'
theme = 'blowfish'
enableRobotsTXT = true

[params]
  colorScheme = "blowfish"
  defaultAppearance = "dark"
  autoSwitchAppearance = true

I’ve added custom enhancements:

  • ✅ Enhanced SEO meta tags with GEO location
  • ✅ Structured data (JSON-LD)
  • ✅ Custom CSS animations and visual effects
  • ✅ jsDelivr CDN integration
  • ✅ Dynamic project showcase from GitHub/Codeberg APIs

The Results
#

Performance Scores
#

Running Lighthouse on my portfolio:

  • Performance: 98/100
  • Accessibility: 100/100
  • Best Practices: 100/100
  • SEO: 100/100

Build Time
#

My entire site with 10+ pages builds in under 1 second.

Hosting Cost
#

$0/month - Hosted on Codeberg Pages for free with custom domain support.

Getting Started Yourself
#

Want to build a similar portfolio? Here’s your roadmap:

  1. Install Hugo: brew install hugo (Mac) or download from gohugo.io
  2. Create Site: hugo new site my-portfolio
  3. Add Blowfish: Clone as git submodule
  4. Configure: Copy my hugo.toml as starting point
  5. Add Content: Create pages in content/
  6. Deploy: Push to GitHub/Codeberg and enable Pages

Or just fork my repository and customize it!

Final Thoughts
#

Choosing Hugo and Blowfish was one of the best decisions for my portfolio. It’s fast, simple, customizable, and free. I can focus on creating content instead of fighting with complex build systems or CMS updates.

For a developer portfolio, you want something that:

  • Shows off your technical knowledge
  • Is easy to maintain
  • Performs excellently
  • Looks professional

Hugo + Blowfish delivers on all fronts. 🎯

💬 Questions? Get in touch or check out the source code

Further Reading
#