Vercel + Vue.js
summary
A concise origin story and engineering playbook for Next.js and Vercel: started as an n4 template experiment inspired by Vue, then rewrites align it with the React ecosystem; it adopts file-system routing and a single-file component feel, then ships automatic static optimization so pages without data hooks become CDN-served HTML, while pages using getStaticProps/getStaticPaths/getServerSideProps produce build-time HTML or per-page serverless lambdas — enabling hybrid SSR/static sites, powering large content and e‑commerce sites with measurable SEO and performance wins.
AI-written summary · about
chapters (35)
- 0:00Intro
- 0:534 years of Next.js: lessons learned What Vercel has learned building a React framework for everyone
- 1:12React at a Vue.js conference?
- 2:09choose your next framework
- 2:34build your next framework
- 3:15Next.js is big
- 3:47Next.js and Vue
- 7:30was amazing to build our pages with
- 8:16Lesson: dogfood your project
- 8:48Wait. There's more...
- 9:38Vue was a huge inspiration to n4
- 9:59Zero JS boilerplate
- 10:19PHP-like templates with inline JS
- 11:20Collocated (SFC)
- 12:05HTML-first smooth learning curve
- 12:28So, what happened to n4?
- 12:57Create Apps with No Configuration
- 13:23Dan Abramov enters the chat
- 16:19We ditched templating to play better with the React ecosystem
- 16:52Lesson: be adaptible
- 20:04Lesson: big markets are big
- 23:37Lesson: stick to your guns
- 23:56Lesson: stick to the physics
- 24:11One small problem: servers
- 24:22Hugo, Gatsby, Gridsome, Netlify enter the chat
- 25:35Static sites: serverless, cheap, reliable, scalable
- 26:07No computation Computation
- 26:44Automatic CDN caching and purging Fiddling with Cache- Control
- 27:16Edge Region
- 27:42Thus, Next.js became Hybrid
- 28:03First, via automatic static optimization
- 29:08Then, with static generation
- 29:57getStaticProps / getStaticPaths +static.html (automatic CDN)
- 31:22Lesson: learn from everyone!
- 31:48Lesson: give back
related talks
01h 01mLearnings from One Year in Production with Next.js on Vercel
04mNuxt.js: Universal Vue.js Applications
19mBuilding for the Edge - Crafting a Next-Gen Framework
37mPatterns for Large Scale Vue.js Applications
44mNuxt.js - Why? How? Oh yeah!
34mNuxt + Vue: The Game-Changer Your New Projects Deserve
27mNuxt 3 – More Than Vue 3 on Steroids
18mNuxt.js - Just Vue and a bit of magic?