JAMSTACK SILLY NAME SERIOUS BUSINESS PHIL HAWKSWORTH
A presentation at Frontend United in May 2019 in Utrecht, Netherlands by Phil Hawksworth
JAMSTACK SILLY NAME SERIOUS BUSINESS PHIL HAWKSWORTH
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STACKS FOR DAYZ AN / LAMP / MAMP / XAMP / ROR / WISA / MEA WISA / MEAN / LAMP / MAMP / XAMP / ROR /
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth k c a t s m ja JAVASCRIPT / API / MARKUP
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WHAT DOES THAT EVEN MEAN?
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DEFINITION / UNDERSTANDING IMPACT / OPPORTUNITIES TOOLS / SERVICES EXAMPLES / RESULTS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth ISN’T THIS JUST A FANCY NEW NAME FOR STATIC SITES? REASONABLE VOICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth @ PHIL HAWKSWORTH DEVELOPER EXPERIENCE, NETLIFY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth ISN’T THIS JUST A FANCY NEW NAME FOR STATIC SITES? REASONABLE VOICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SOME DEFINITIONS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC /ˈstatɪk/ lacking in movement, action, or change, especially in an undesirable or uninteresting way.
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC /ˈstatɪk/ lacking in movement, action, or change, especially in an undesirable or uninteresting way.
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC EXPERIENCE ? or ARCHITECTURE ?
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC VIRTUE a as
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC DYNAMIC vs
netlify JAMstack. Silly name, serious business c i m a n y d c i t a st Frontend United, Utrecht, 2019 CDN @philhawksworth LOAD BALANCER WEB SERVERS DB SERVERS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATICs n a e m CAPABLE OF BEING SERVED DIRECTLY FROM A CDN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATICs n a e m AN OPPORTUNITY TO REDUCE COMPLEXITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC VIRTUE a as
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SO…… REASONABLE VOICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth ISN’T THIS JUST A FANCY NEW NAME FOR STATIC SITES? REASONABLE VOICES, AGAIN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth LET’S TALK STACKS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth LAMP
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 APACHE PHP @philhawksworth HTTP ROUTING AND SERVING PREPROCESSING MYSQL DATA ACCESS LINUX OPERATING SYSTEM WEB SERVER
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth JAM
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth APIs JAVASCRIPT MARKUP DATA ACCESS RUNTIME BROWSER STATICCDN SERVER HTTP ROUTING AND SERVING
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth k c a t s m ja PRE-RENDERED SERVED STATICALLY PROGRESSIVELY ENHANCED
netlify JAMstack. Silly name, serious business APACHE PHP MYSQL LINUX WEB SERVER Frontend United, Utrecht, 2019 @philhawksworth WITH JAMSTACK THE STACK HAS MOVED UP A LEVEL TO THE BROWSER APIs JAVASCRIPT MARKUP BROWSER
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth n a c s i h t SIMPLIFY DEPLOYMENTS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PROJECT COMPLEXITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth THE PERFECT PROJECT TIMELINE FIXES ! BRIEF START SCOPE RE-SCOPE CLIENT REVIEW LAUNCH “ FINAL” SIGN OFF AWARDS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth LAUNCH DAY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth THE PERFECT PROJECT TIMELINE FIXES ” BRIEF START SCOPE RE-SCOPE CLIENT REVIEW LAUNCH “ FINAL” SIGN OFF AWARDS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth THE PERFECT PROJECT TIMELINE ” :lemon: BRIEF START SCOPE RE-SCOPE FIXES CLIENT REVIEW LAUNCH “ FINAL” SIGN OFF AWARDS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth THE PERFECT PROJECT TIMELINE FIXES
START SCOPE RE-SCOPE CLIENT REVIEW LAUNCH “ FINAL” SIGN OFF AWARDS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business c i m a n y d c i t a st Frontend United, Utrecht, 2019 CDN @philhawksworth LOAD BALANCER WEB SERVERS DB SERVERS
netlify JAMstack. Silly name, serious business GET TO THE CHOPPER CDN Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WELL ACTUALLY… THIS JAMSTACK STUFF IS NOTHING NEW THAT VOICE ON THE INTERNET
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 BAKE, DON’T FRY – Aaron Swartz @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth I CARE ABOUT NOT HAVING TO MAINTAIN CRANKY AOLSERVER, POSTGRES AND ORACLE INSTALLS AARON SWARTZ , 2002
netlify JAMstack. Silly name, serious business c i m a n y d c i t a st Frontend United, Utrecht, 2019 CDN @philhawksworth LOAD BALANCER WEB SERVERS DB SERVERS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 HOSTING LOCAL STATIC SERVER BUILD CONTENT TEMPLATES DATA @philhawksworth CDN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth IMPACTS AND OPPORTUNITIES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SECURITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth A GREATLY REDUCED SURFACE AREA
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth FAR FEWER MOVING PARTS TO ATTACK
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth YOUR-DOMAIN.COM/WP-ADMIN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PERFORMANCE & SCALE
netlify JAMstack. Silly name, serious business c i m a n y d c i t a st Frontend United, Utrecht, 2019 CDN @philhawksworth LOAD BALANCER WEB SERVERS DB SERVERS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DEVELOPER EXPERIENCE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DEPLOYMENT CONFIDENCE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth A JAMSTACK SITE CAN MORE EASILY HAVE IMMUTABLE, ATOMIC DEPLOYS
netlify JAMstack. Silly name, serious business STAGING BOB ALICE Frontend United, Utrecht, 2019 @philhawksworth PROD
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth BEYOND STATIC
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth AUTOMATION REPEATABILITY / PREDICTABILITY / ACCOUNTABILITY / AGILITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 HOSTING LOCAL STATIC SERVER BUILD CONTENT TEMPLATES DATA @philhawksworth CDN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth GIT-BASED DEPLOYMENTS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth CI/CD + HOSTING LOCAL CDN STATIC SERVER BUILD GIT BUILD
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DATA SOURCES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth CONTENT APIS CI/CD + HOSTING LOCAL CDN STATIC SERVER BUILD GIT BUILD
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DEPLOYING WITH LOW FRICTION n i s lt u s e r HIGH CONFIDENCE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth A RIDICULOUS AUTOMATION EXAMPLE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 FINDTHAT.AT/TIME https://setyourwatchby.netlify.com @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 FINDTHAT.AT/TIME https://setyourwatchby.netlify.com @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 FINDTHAT.AT/TIME https://setyourwatchby.netlify.com @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 FINDTHAT.AT/TIME https://setyourwatchby.netlify.com @philhawksworth
netlify JAMstack. Silly name, serious business WEBSTASK.IO Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business WEBSTASK.IO Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth ( DON’T DO THIS )
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth EXAMPLES AND RESULTS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth REACTJS.ORG REACTJS.ORG STATIC
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 VUEJS.ORG REACTJS.ORG @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 DOCS.CITRIX.COM SMASHINGMAGAZINE.COM @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth TURNAROUND TIME FOR UPDATES WENT FROM WEEKS TO MINUTES BETH POLLOCK, CITRIX youtube.com/watch?v=kvS5h5domf0
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WE ESTIMATE OUR ANNUAL COST SAVINGS TO RUN THE SITE PROPERLY IS 65% BETH POLLOCK, CITRIX youtube.com/watch?v=kvS5h5domf0
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PLATFORMS from 5 to 1 https://www.netlify.com/case-studies/smashing/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 SMASHINGMAGAZINE.COM SMASHINGMAGAZINE.COM @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WE HAD SOME CACHING ISSUES… WITH PROBABLY EVERY SINGLE WORDPRESS CACHING PLUGIN OUT THERE VITALY FRIEDMAN
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PLATFORMS from 5 to 1 https://www.netlify.com/case-studies/smashing/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SMASHINGMAGAZINE.COM TIME TO FIRST LOAD m o r f to 800MS 80MS https://www.netlify.com/case-studies/smashing/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth proxx
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PROXX.APP PAYLOAD TO INTERACTIVE 25KB https://web.dev/proxx-announce/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PROXX.APP TIME TO INTERACTIVE r e d un 5 SECONDS https://web.dev/proxx-announce/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth JAVASCRIPT
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth JAMSTACK SITES DON’T HAVE TO DEPEND ON JAVASCRIPT A COMMON MISCONCEPTION
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
<body id=”app”>!</body>
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SHIP LESS JAVASCRIPT ALEX RUSSELL
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SOMETHING, SOMETHING POWER, SOMETHING, SOMETHING RESPONSIBILITY VARIOUS MARVEL CHARACTERS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PRERENDING TO REMOVE THE NEED FOR AN ORIGIN SERVER PROGRESSIVE ENHANCEMENT TO ENRICH THE EXPERIENCE WITH JAVASCRIPT AND SERVICES VIA APIS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth AUGMENTING JAMSTACK SITES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth I ABSOLUTELY POSITIVELY NEED A LITTLE LOGIC ON A SERVER MANY OF US, SOMETIMES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SERVERLESS TO THE RESCUE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth FUNCTIONS AS A SERVICE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth FUNCTIONS AS A SERVICE ENABLE A MICROSERVICES ARCHITECTURE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth LOWERING THE OVERHEAD OF DEPLOYING / MAINTAINING / MANAGING / SECURING OUR CODE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SHIFT THE BURDEN SOFTWARE AND PATCHES OPERATING SYSTEM NETWORK PHYSICAL / VIRTUAL SCALING
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth BY BREAKING THE MONOLITH APART, WE CAN ENJOY BOUGHT OR BUILT SPECIALIST SERVICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth ONE JOB
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth YOU HAD ONE JOB
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth EVENTS, WEBHOOKS, MICROSERVICES, AND APIS PROVIDE GLUE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SERVICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth BOUGHT SERVICES
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth CMS ASSETS COMMERCE IDENTITY CONTENTFUL SANITY GRAPHCMS CLOUDINARY STRIPE SNIPCART AUTH0 OAUTH
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth BUT WHAT OF THE RISK?
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth the DREAM CRUSHER
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth VENDORS PROVIDING A SINGLE SERVICE DEPEND ON ITS SUCCESS MORE THAN YOU DO
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth TECHNICAL AND SERVICE LEVEL CONTRACTS
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth BOUGHT BUILT SERVICES
netlify JAMstack. Silly name, serious business CMS Frontend United, Utrecht, 2019 DAMS @philhawksworth COMMERCE IDENTITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth SMALLER SURFACES ARE EASIER TO REASON ABOUT, AND CREATE GREATER AGILITY
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WEBHOOKS AND SERVERLESS AND AUTOMATION (OH MY!)
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth FINDTHAT.AT/COMMENTS https://jamstack-comments.netlify.com JAMSTACK-COMMENTS.NETLIFY.COM ZERO JAVASCRIPT DEPENDENCIES COMMENTS AS PAGE CONTENT NOTIFICATIONS AND MODERATION VIA SLACK
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth WHAT IS THE JAMSTACK? THE QUESTION WE STARTED WITH
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth k RENDERED IN ADVANCE c a t s jam e r a s e it s NOT DEPENDENT ON AN ORIGIN PROGRESSIVELY ENHANCED IN THE BROWSER WITH JAVASCRIPT
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth DO WE NEED IT? THE QUESTION WE STARTED WITH
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth REDUCED INFRASTRUCTURE COSTS k c a t s jam s g n bri IMPROVED SECURITY, PERFORMANCE, SCALABILITY PROJECT LIFECYCLE CONFIDENCE
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth STATIC SITE GENERATORS staticgen.com NETLIFY STATIC SET YOUR WATCH - FRICTION FREE DEPLOYMENTS www.netlify.com https://www.netlify.com/blog/2018/08/02/exploring-the-potential-of-friction-free-deployments/ CITRIX PRESENTATION FROM JAMSTACKCONF NYC youtube.com/watch?v=kvS5h5domf0
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth PHIL’S OWN JAMSTACK SITE hawksworx.com HEADLESS / DECOUPLED CMS STATIC ABOUT THE JAMSTACK / COMMUNITY headlesscms.org jamstack.org THE NEW DYNAMIC www.thenewdynamic.org/
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 FINDTHAT.AT/CONF https://jamstackconf.com @philhawksworth
netlify JAMstack. Silly name, serious business Frontend United, Utrecht, 2019 @philhawksworth N O D N O L Y L U J 0 1 9 FINDTHAT.AT/CONF https://jamstackconf.com
THANKS FINDTHAT.AT/JAMSTACK @PHILHAWKSWORTH
