Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
New Stack Lunch Presentation
Search
Mathias Biilmann
March 07, 2016
Programming
610
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
New Stack Lunch Presentation
Lunch Presentation at Zendesk
Mathias Biilmann
March 07, 2016
More Decks by Mathias Biilmann
See All by Mathias Biilmann
React and the JAMstack - Reactathon Fundamentals 2018
biilmann
1
800
The JAMstack - Smashing Conf Freiburg 2017
biilmann
1
930
Hide Your Keys
biilmann
0
300
Rise of the JAMstack
biilmann
0
750
The JAM Stack
biilmann
21
12k
Comparing static site generators and how to onboard from a dynamic workflow
biilmann
3
1.8k
Other Decks in Programming
See All in Programming
才能?センス?知らん、 続けたもん勝ちだ。-- 結婚・出産・癌を越えてなお、私がプロダクトを創り続ける理由
16bitidol
2
750
エージェンティックRAGにAWSで入門しよう!
har1101
9
1.9k
スマートグラスで並列バイブコーディング
hyshu
0
280
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
4
1.6k
Webフレームワークの ベンチマークについて
yusukebe
0
190
継続モナドとリアクティブプログラミング
yukikurage
3
330
AI時代の仕事技芸論〜ソフトウェア開発で「遊ぶように働く」職人的熟達のすすめ(スクフェス仙台 2026バージョン)
kuranuki
0
320
キャリア迷子上等 ─ "ない道"は自分で作ればいい
16bitidol
3
2.8k
AI駆動開発を妨げる技術的負債の解消アプローチ / ai-refactoring-approach
minodriven
17
8.6k
【やさしく解説 設計編 #0】DDDのコード、読めるのに分からない人へ
panda728
PRO
1
190
どこまでゆるくて許されるのか
tk3fftk
0
310
Generative UI & AI-Assistants for Your Angular Solutions
manfredsteyer
PRO
0
120
Featured
See All Featured
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
techseoconnect
PRO
0
250
Automating Front-end Workflow
addyosmani
1370
210k
Navigating Weather and Climate Data
rabernat
0
270
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
ryanjones
0
180
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.5k
Crafting Experiences
bethany
1
210
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
11k
Faster Mobile Websites
deanohume
310
32k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
460
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
190
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
280
Transcript
The New Stack Chris Bach & Matt Biilmann, Netlify 2016
1
The Web Dev Toolchain Disrupted • Modern Build Tools •
Modern Browsers • Modern APIs • CDN Hosting 2
Push your web-app or site to netlify. - the modern
day platform that developers use to manage and publish their content online. 3
Butterfly Butterfly Effect In chaos theory, the butterfly effect is
the sensitive dependence on initial conditions in which a small change in one state of a deterministic nonlinear system can result in large differences in a later state. 4
"I'm writing some scripts to try to track things a
whole lot faster." Thu Apr 07 2005, Linux-Kernel Mailing List 5
Made by MarketMe GitHub launched February 2008, grew to 10
million repositories within the first 5 years, now has more than 10M active users. 6
10 Years Ago 7
Or today? For many Wordpress developers 8
Git Centric Workflow • Anything that’s text based goes in
a git repo • Clone, fork, push and pull all the time • Git has become as essential as our text editors 9
Another Detour • GitHub rode the Rails wagon • Rails
came with Rake • Task runners went mainstream 10
Front-end Build Tools • All modern front-enders use build tools
and task runners • Grunt, Gulp, Webpack, Ember-CLI • Jekyll, Middleman, Roots, Hugo, Metalsmith 11
Git Centric Workflow Any front-end project at netlify should work
somewhat like this 12
Git Centric Workflow After the initial clone, the flow becomes
something like this 13
Pull • Watch • Push 14
Pure Front-Ends • Not mixed with backend code or dependency
• All you need is in Git • No database, message queue, search engines, etc… 15
16
Pull • Watch • Push Gulp + Jekyll, BrowserSync, No
Backend 17
APIs Dynamic needs handled by 3rd party widgets Made by
MarketMe 18
Most Dev Friendly Setup • All content live Markdown or
YAML files • Everything in version control • Use all of our text based dev tools 19
20
Single Page App • Run full front-end app locally with
no dependencies • Run locally against production API • Pure front-end, completely decoupled from backend 21
Made by MarketMe 22 The Production Story
Pull • Build • Push 23
JavaScript, APIs & Markup • Can run anywhere • Distribute
on Global CDN nodes • Faster, Safer, Simpler & Cheaper 24
Intelligent CDN • Atomic Deploys • Instant Cache Invalidation •
Routing intelligence: Proxying, GeoIP, Authentication 25
26
Example: WeWork • Gradual transition from Rails to Roots •
No huge rewrite • Proxy all non-static requests to legacy origin 27
One Rule netlify intelligently proxies only URLs with no corresponding
file 28
29
Closing the Circle 30
31
32
Example: Sequoia • Large site: ~15,000 HTML Pages • Fetches
data from Contentful + Job API • Trigger rebuild whenever content change 33
34
Content Editors? • How to get your marketing team on
board? • Ideal dev cycle, but what about non-techies • Normal people are not int “Git Centric Worflows”! 35
36
Thanks! Matt Biilmann www.netlify.com @biilmann 37