Upgrade to Pro — share decks privately, control downloads, hide ads and more …

A Delightfully Short Guide to Static Site Generators

Matt Woods
November 22, 2019

A Delightfully Short Guide to Static Site Generators

Need to launch a quick-and-easy site for your next side-project, blog (or just as a favor for a friend?) Before you reach for Github Pages, make sure you've considered the new generation of static site generators to streamline your development process.

We'll take a crash course through the most exciting tools that introduce API-driven content through GraphQL and even make it a snap to add smart functionality through serverless functions.

Hey! I'm Matt Woods, a growth marketer, software developer and shameless book addict. Currently, I run Growth at Tailwind, an Oklahoma City software startup that makes marketing easy for small businesses. I also co-founded OKC Indie Hackers to help scrappy creators build software that makes the world better.

Matt Woods

November 22, 2019
Tweet

More Decks by Matt Woods

Other Decks in Programming

Transcript

  1. A Delightfully Short Guide to Static Site Generators The Best

    Way to Instantly Ship Free, Blazing-Fast Websites with Serverless Functions in 2019 Matt Woods Growth, Tailwind @matopher
  2. My first-ever site = "This is Magic" @matopher

  3. Everyone needs a plain 'ol website (eventually) @matopher

  4. Everyone needs a plain 'ol website (eventually) One of a

    couple things will happen: 1. You'll need a website that just works. (Docs, Get your next project discovered, Blog) 2. Someone new to development will need your help. (Recommend the *right* approach) @matopher
  5. What's a JAMstack? ❌ Server-side CMS ❌ SPA that builds

    at runtime ❌ Monolithic server-run web app (Sadly, no.) It doesn't depend on a server. @matopher
  6. What's a JAMstack? ✅ Javascript Any dynamic programming during the

    request/ response cycle ✅ APIs All server-side processes or database actions are abstracted into reusable APIs ✅ Markup Templated markup should be prebuilt at deploy time
  7. Pros Dead simple hosting Modern tools = A developer experience

    you'll actually love Everything lives in Git Blazing fast: A stack of files that gets to first byte quickly Thriving, open-source community @matopher
  8. Cons ↪ You'll have to rebuild the site anytime you

    add new content. (So... A LOT.) New learning curve for handling authentication, forms, and dynamic content Generally not as user-friendly for non-developers unless you pair with a 3rd-party CMS on the backend @matopher
  9. Who's developing like this? Airbnb Lodash Docs Figma @matopher

  10. Why an Insanely Popular Web Dev Blog Switched to a

    Static Site @matopher
  11. Why an Insanely Popular Web Dev Blog Switched to a

    Static Site ➡ 4 Separate Platforms 1 Site, No Backend + Algolia search + GoCommerce + Netlify CMS + Progressive Web App @matopher
  12. Which Static Site Generator is right for me? @matopher

  13. Jekyll: The Trusty Old Guard Simple, sturdy & familiar Easy

    to add content @matopher
  14. Gatsby: The Speed Demon Blistering Fast Out of the Box

    (prefetching, code-splitting, progressive web app) Source Data with GraphQL Just query what you need @matopher
  15. What web hosting should I use? @matopher

  16. GitHub Pages: Hosting You Already Have I have nothing but

    love for GitHub Pages. It works great! But... @matopher
  17. Netlify: Free Hosting Developers Won't Hate ✅ Great continuous deployment

    experience ✅ Easy to add serverless functions & helpers ✅ Generous free plan @matopher
  18. Netlify: Free Hosting Developers Won't Hate A hosting platform centered

    around Git that makes it a snap to pump out fast, modern websites. @matopher
  19. Netlify + Serverless Functions = ❤ @matopher

  20. Netlify + Serverless Functions = ❤ @matopher

  21. What can you do with Netlify's serverless functions + helpers?

    - Use authentication to access an admin dashboard - Easy form handling - Use a headless CMS to update your site's content @matopher
  22. Let's launch some fun stuff