Building a Portfolio with Eleventy

Eleventy (11ty) is an amazing static site generator that gives you the power and flexibility to build modern websites while keeping things simple.

Why Choose Eleventy?

After trying various static site generators, I landed on Eleventy for a few key reasons:

1. Flexibility

Eleventy doesn't force you into a specific framework. You can use:

Nunjucks
Liquid
Handlebars
Markdown
And many more templating languages

2. Speed

Eleventy is blazing fast. Build times are incredibly quick, and the generated sites are lightweight and performant.

3. Zero JavaScript by Default

Your site won't ship with any JavaScript framework code unless you explicitly add it. This means faster page loads and better performance.

Project Structure

Here's how I organized my Eleventy project:

/src
  /_includes
    /layouts
      - base.njk
      - post.njk
  /blog
    - post-1.md
    - post-2.md
  /css
    - styles.css
  /js
    - script.js
  - index.njk

Creating Layouts

Layouts in Eleventy are reusable templates. Here's a simple example:

<!DOCTYPE html>
<html>
<head>
  <title>Building a Portfolio with Eleventy</title>
</head>
<body>
  
</body>
</html>

Writing Content

With Eleventy, writing content is as simple as creating a Markdown file with frontmatter:

---
title: My Post
layout: layouts/post.njk
---

Your content here...

Conclusion

Eleventy strikes the perfect balance between simplicity and power. Give it a try for your next project!