Categories
JAMstack JavaScript React

Gatsby and the Static Site Renaissance

Static site generators are having a moment. Gatsby, the React-based SSG, is growing fast. Netlify is building a business around static hosting. The term "JAMstack" (JavaScript, APIs, Markup) is catching on. After years of everything being a server-rendered app, we're rediscovering that static HTML is often the right answer.

What Gatsby Does

Gatsby generates static websites using React and GraphQL. Write components, query data, run the build, and get plain HTML/CSS/JS files. Deploy anywhere—no server needed.

import React from 'react';
import { graphql } from 'gatsby';

export default function BlogPost({ data }) {
  const post = data.markdownRemark;
  return (
    <article>
      <h1>{post.frontmatter.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: post.html }} />
    </article>
  );
}

export const query = graphql`
  query($slug: String!) {
    markdownRemark(fields: { slug: { eq: $slug } }) {
      html
      frontmatter {
        title
      }
    }
  }
`;

At build time, Gatsby: