Jamstack 101

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Arcu augue massa, tincidunt proin nunc viverra tristique tempor, ipsum. At lectus vel pretium tempor ut dui vivamus sit.

First art Second art
Arrow
Mouse

JavaScript

Statically generated pages are brought to life with client-side JavaScript libraries and frameworks, such as Algolia and Next.js.

Retro computer 
import Document, { Html, Head, Main, NextScript } from 'next/document'
								
class MyDocument extends Document {
  render() {
    return (
      <Html lang="en">
        <Head>
          {/*Fonts*/}
          <link rel="preconnect" href="https://rsms.me" crossOrigin="anonymous" />
          <link rel="preconnect" href="https://kit.fontawesome.com" crossOrigin="anonymous" />
          <link rel="preload" href="https://rsms.me/inter/inter.css" as="style" />
          <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
          <noscript>
            <link rel="stylesheet" type="text/css" href="https://rsms.me/inter/inter.css" />
          </noscript>
        </Head>
        <body>
          <Main />
          <NextScript />
        </body>
      </Html>
    )
  }
}
								
export default MyDocument
Arrow

API

At build time, a Jamstack website uses data from one or more APIs to generate markup. These APIs can be a headless CMS like Prismic, a database like Supabase, or even a local JSON file!

Markup

When ready for deployment, a static-site generator such as Astro or Next.js is used to compile the website. The end result is a collection of pre-rendered HTML pages that can be delivered lightning-fast over a CDN like Vercel’s Edge Network.

First art Second art

Top Audit Scores

Score ellipse
Score ellipse
Score ellipse
Score ellipse

Search engines, business stakeholders, and end-users gauge a website’s value using metric tools like Google Lighthouse, which measures site performance, SEO, and accessibility.

Performance is one of the most difficult scores to get to 100. This is especially true in a time when users demand JavaScript-heavy, highly-interactive web experiences.

A Jamstack website, delivering SEO-friendly, lean & clean HTML in milliseconds, promises higher search-engine ranking and a more positive, responsive end-user experience.