A presentation at Jamstack Toronto - June 2021 by Phil Hawksworth
Jamstack growing up Back for context. Forward for future Phil Hawksworth, Netlify
!
Has it really been 2 years?
Has it really been 2 years?
Has it really been 2 years?
I miss your faces
but this is still Jamstack Toronto
…what was I saying?
O T N I K C U T S G N I T GET K C A T S M JA PHIL HAWKSWORTH findthat.at/stuck-in
netlify JAMstack - Serious Busine ss Smashing Conference, Toront o, June 2019 @philhawksworth O T N I K C U T S G N I T GET K C A T S M JA QUICKLY SAY HELLO BRIEFLY INTRODUCE CONCEPTS HELPFULLY OUTLINE BENEFITS SHAMBOLICALLY SHOW SOME DEMOS PHIL HAWKSWORTH findthat.at/stuck-in HAPPILY ANSWER QUESTIONS
netlify netlify JAM stack - ss Serious Business s Busine JAMstack - Seriou @philhawksworth Pixel Pioneers, June 2019 Smashing Conference, Toront o, June 2019 @philhawksworth ? k c a t s m a j is it O T N I K C U T S G N I T T E G HUGO GATSBY JEKYLL K C A T S M JA YAML NO JSQUICKLY NO APIsSAY GITHUHBEPA LLOGES yes MARKDOWN GRAPBHQ RIEL FAPLYIs ION AT HYTDR JSIN RODUCE S3 AMCAZOON NC yes PHIL HAWKSWORTH EPTS MARKDOWN NS TIO AC ER JS INT HAPELIsPFULLY NO O U T L IN E UD CLO LE GOOG B E N E F IT S yes NUXT JSON JS INTERACTIONS SHMM AMERBCE OLIC APAIsLLY CO OW SOME NESTLIHFY yes DEMOS ORIGIN SERVER findthat.at/stuck-in HAND-MADE PWA WEBPACK JWT IsY BROWSEHARPAPPIL AZUREANSWER yes QUESTIONS
netlify JAMstack - Serious Business netlify netlify JAM stack - ss Serious Busine s Busine JAMstack - Seriou Smashing Conference, Toronto, Jun e 2019 Pixel Pioneers, June 2019 ss Smashing Conference, Toront awksworth @philhaw@philh ksworth o, June 2019 @philhawksworth ? k c a t s m a j is it O T N I K C U T S E N G J N I O T YS THE BENEFITS GET f o K C A T S M JA JEKYLL YAML NO JSQUICKLY NO APIsSAY GITHUHBEPA LLOGES GATSBY MARKDOWN GRAPBHQ RIEL FAPLYIs ION AT HYTDR JSIN RODUCE S3 AMCAZOON NC HUGO MARKDOWN NS TIO AC ER JS INT HAPELIsPFULLY NO O U T L IN E UD CLO LE GOOG NUXT JSON JS INTERACTIONS SHMM AMERBCE OLIC APAIsLLY CO OW SOME NESTLIHFY HAND-MADE PWA WEBPACK JWT IsY BROWSEHARPAPPIL AZUREANSWER SERVING STATIC ASSETS yes yes PHIL HAWKSWORTH EPTS B E N E F IT S yes yes DEMOS ORIGIN SERVER findthat.at/stuck-in yes QUESTIONS
netlify netlify us Business Serio k -stac JAMstac JAM k - Serious Business netlify netlify onto, June 2019 Smashing Conference, Tor JAM stack - ss Serious Busine s Busine JAMstack - Seriou Smashing Conference, Toronto, Jun e 2019 Pixel Pioneers, June 2019 ss @philhawksworth Smashing Conference, Toront awksworth @philhaw@philh ksworth o, June 2019 @philhawksworth K C A T S M A J O T N I K C U T S E N G J N I O T YS mTHeEanBsENEFITS GET ? k c a t s m a j is it f o K C A T S M Jyes ACAPyAes BELPETS OyFesBEBNEEFITISNG ySesEDERMOVS EDyes QUESTIONS SHEIL RHAWVKDSWIIONRRTHEGCTSLYTAFRTOIRVCMER AASCDSNETS P ORIGIN SE JEKYLL YAML NO JSQUICKLY NO APIsSAY GITHUHBEPA LLOGES GATSBY MARKDOWN GRAPBHQ RIEL FAPLYIs ION AT HYTDR JSIN RODUCE S3 AMCAZOON NC HUGO MARKDOWN NS TIO AC ER JS INT HAPELIsPFULLY NO O U T L IN E UD CLO LE GOOG NUXT JSON JS INTERACTIONS SHMM AMERBCE OLIC APAIsLLY CO OW SOME NESTLIHFY findthat.at/stuck-in HAND-MADE PWA WEBPACK JWT IsY BROWSEHARPAPPIL AZUREANSWER
Y A D TO Is all that still true?
@ Phil Hawksworth Director of Developer Experience, Netlify
findthat.at/jamstack/growing
findthat.at/jamstack/book
findthat.at/interesting
Y A D TO Is all that still true?
Y A D O T Are you shifting the goal posts?
Let’s talk 1 2 What made a Jamstack site Jamstack? What has changed and what’s new in the Jamstack world? 3 Phil, please shut up and just show us something
1 What made a Jamstack site Jamstack? @philhawksworth
It used to be so simple ASK FOR STUFF GET STUFF @philhawksworth
Time and context TRADITIONAL STACK LOAD BALANCERS WEB SERVERS DATABASES JAMSTACK ASSETS ON CDN BUILD AHEAD OF TIME @philhawksworth CODE & CONTENT
Decoupling @philhawksworth
Front-end code is no longer limited to being a product of a back-end system @philhawksworth
Capable of being served directly from a CDN @philhawksworth
Offloading hosting complexity as a solved problem @philhawksworth
Pre-generation of a site + The workflows and automation that unlocks @philhawksworth
2 What has changed and what’s new in the Jamstack world? @philhawksworth
? E W D L U O H S ? E COULD W We want to use it for more dynamic content / user generated content / massive sites
Serverless findthat.at/webserverless @philhawksworth
Distributed Persistent Rendering (Builds with a long tail) findthat.at/dpr @philhawksworth
Code @philhawksworth
Code Build Deploy number 75 @philhawksworth
Code Build Deploy number 75 @philhawksworth On demand
Code Build Deploy number 75 @philhawksworth On demand
Code Build Deploy number 75 @philhawksworth On demand
Code Build Deploy number 76 @philhawksworth
Code Build Deploy number 76 @philhawksworth On demand
Code Build Deploy number 76 @philhawksworth On demand
But is that Jamstack? @philhawksworth
What matters? @philhawksworth
What is the valuable part of Jamstack? @philhawksworth
? T I IS That you use JavaScript, APIs and Markup in the site?
? T I IS That everything is pre-generated at build time?
? T I IS That it uses Netlify things, and only Netlify things?
? T I IS That it uses Netlify things, and only Netlify things?
nah @philhawksworth
Front-end code is no longer limited to being a product of a back-end system @philhawksworth
Front-end code is not prescribed by a back-end system @philhawksworth
Front-end code is not prescribed by a back-end system @philhawksworth
Deploys are immutable and atomic @philhawksworth
Live Deploy 88 Deploy 87 Deploy 86 @philhawksworth Deploy 86
Deploy 89 Live Deploy 88 Deploy 87 Deploy 86 @philhawksworth Deploy 86
Live Deploy 89 Deploy 88 Deploy 87 Deploy 86 @philhawksworth Deploy 86
Deploy 89 Live Deploy 88 Deploy 87 Deploy 86 @philhawksworth Deploy 86
Deploy 89 Deploy 88 Deploy 87 Live Deploy 86 @philhawksworth Deploy 86
Zero burden on the developers for caching logic
Caching is one of the easiest things in computer science — Nobody ever. Ever. @philhawksworth
These are the principles and the values that define Jamstack @philhawksworth
Jamstack is maturing @philhawksworth
“Well then, the name is not perfect” @philhawksworth
“Well then, the name is not perfect” @philhawksworth
2 Phil, Please shut up and just show us something @philhawksworth
colorways.netlify.app findthat.at/torontoh
Let’s look at a demo repo
What’s next?
Distributed Persistent Rendering RFC findthat.at/dpr/rfc Colorways example using Netlify’s on-demand builders findthat.at/colorways An intro to Supabase with serverless functions findthat.at/supa
Cheeky touts
Jamstack Conf - October 2021 jamstackconf.com Jamstack Conf - Speak! jamstackconf.com/cfp Jamstack Community Survey 2021 jamstack.org/survey
Thanks @philhawksworth
Don’t they grow up fast? In the years since the term Jamstack was introduced, it has evolved. But does it still represent the same thing or has it morphed into something else entirely?
In this talk, Phil will explore some developments in this space, such as serverless functions and DPR. He’ll outline the core principles at the heart of Jamstack, and describe how it is growing and is viable for more types of projects than he ever expected, all while staying true to those important principles.
