$30 off During Our Annual Pro Sale. View Details »

A Delightfully Short Guide to Static Site Gener...

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. 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
  3. 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
  4. 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
  5. 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
  6. 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
  7. 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
  8. 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
  9. GitHub Pages: Hosting You Already Have I have nothing but

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

    experience ✅ Easy to add serverless functions & helpers ✅ Generous free plan @matopher
  11. 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
  12. 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