loading...
Cover image for Introducing the 11ty Netlify Jumpstart

Introducing the 11ty Netlify Jumpstart

5t3ph profile image Stephanie Eckles ・1 min read

I'm pleased to share with you a template repo to help give you a jumpstart into using 11ty!

Quickly launch an 11ty-generated static site. Includes a minimal Sass framework, and generated sitemap, RSS feed, and social share preview images.

Skip the chit chat and jump to it >

This jumpstart is intended to be just enough to be a functional site/blog using 11ty, and also to introduce essential 11ty features.

Review the "Quick Start" for how to get this starter up and running for your project.

I spent a decade creating WordPress themes and plugins then flipped to product development + leading development of a multi-platform enterprise design system. My intro to JAMstack was with Gatsby, but 11ty fills a special place that is so needed for truly static sites. I'm in love, and I think you will be, too.

This jumpstart is based on my HTML / Sass Jumpstart which you might enjoy if you're not in need of 11ty.

This jumpstart is an abstraction of my setup for ModernCSS.dev which was my first 11ty site.

Is Netlify hosting required?

It's not required, but highly recommended, and is also how the build process is setup to run against.


I plan to do a screencast - possibly a live one? - explaining more about this jumpstart and why I'm so pro-11ty. Comment below if you have questions or would be interested in watching a live walkthrough ✨

Posted on May 24 by:

5t3ph profile

Stephanie Eckles

@5t3ph

Girl Geek, Web Dev (frontend/JS/React) building a design system, teaching a code video series, authoring ModernCSS.dev, egghead instructor, mom to 2 girls

Discussion

markdown guide
 

Hey Stephanie, quick question: if you were building a static agency website today (main requirement: speed & performance&SEO, CMS is an extra), would you build it with 11ty or gatsby? 🤔 (or something else?)

 

It's really hard to beat the performance and flexibility of 11ty - unless you actually need React features.

I manage a quite complicated Gatsby site and I feel I ended up with a lot of overhead to get things to correctly "talk" to each other to compile correctly on the page, vs. 11ty where I can throw all sort of pieces and bits at a template and it just works.

The static HTML 11ty delivers is going to effortlessly result in speed and performance with the flexibility to source from any CMS or data source of any kind.

SEO in either case has a bit of manual work but can be templated.

The things that Gatsby offers you are a head start for things React doesn't come with like routing, and also offers GraphQL for interfacing with data sources.

The way 11ty handles data is so flexible it's why I fell in love with it. Plus the template language compiling of 11ty enables writing markdown next to HTML with a third templating language thrown in and you can on a whim compile out to anything you want, like json or XML which is like 🤯

 

Thank you so much for the elaborate answer, Stephanie!

Yes, I feel Gatsby is an overkill for what I need. Definitely don't need React or graphql and you are totally right about 11ty and data handling (like how you can have glob data and it just automatically gets picked up, or you can have an individual data file for each of your files 🤯)

I've been following this: rphunt.github.io/eleventy-walkthro... and it's been a superb guide so far.

I'm using gatsby for my personal site and I remember that it was rather troublesome to get the blog tags going, with 11ty it was so easy (just looping through a collection!).

Seems Gatsby wins if you need to do a lot of customization done quickly - so you can go with plugins/themes - and I've read something about image handling being pretty basic in 11ty, but yeah, in terms of usability 11ty wins!

Super looking forward to discussing this with you live on Twitch! 💪

 

Will give it a try. Thanks for sharing.