Going Headless: Zero to Next js Hero
summary
Sets up a Next.js site with Storyblok and Tailwind CSS from scratch, builds a simple blog with three articles and a featured-articles block, wires Storyblok’s preview using a draft token, adds live in-page editing via the Storyblok React helper sbEditable and by listening to change/input events (so edits update state without creating a save each keystroke), resolves article relations on the server (resolve relations), and deploys to Vercel via webhook — everything works end-to-end.
AI-written summary · about
chapters (7)
- 0:00Start
- 12:45open the components folder
- 16:39add the tailwind
- 24:34create a featured section here on the home page
- 27:47add an image
- 29:34create a new component definition
- 37:16set up the webhook
related talks
07mBy the Power of Headless!
28mHow to View and React without a Head
23mSky’s the limit: Headless eCommerce with Next.js
26mHow to View and React without a Head
10mEmpowering Efficiency: Unifying 11 Unique Websites with Next.js and Storybook
17mEstablishing Fastest Online Presence with Next.js, Storyblok and Layer0
55mNo more conflicts: Jamstack that works for developers & business users with Gatsby.js
22mHow to add a built-in authoring experience to Next.js