SvelteKit 1.0 Folder Routing and Loaders - Hands-on Demo With Storyblok

Video Description

SvelteKit just recently launched the official 1.0! Some of the recent changes with SvelteKit have been quite substantial, and some people have pushed back on them. Regardless, let's look at how to use the new folder based routing and loaders in SvelteKit. For the demo, we'll be using Storyblok as a Headless CMS to store Speaker. We'll load that data into our app using a SvelteKit loader and then display it to the page. We'll also use the Visual Editor in Storyblok to get a full live preview of our data. **Sponsored By Storyblok** https://storyblok.com/ Check out That Conference - https://that.us/ **Resources** Source Code - https://github.com/bradgarropy/jqq-demos Setup Tailwind with SvelteKit - https://tailwindcss.com/docs/guides/sveltekit Storyblok Svelte NPM Package - https://www.npmjs.com/package/@storyblok/svelte Follow Brad Garropy on YouTube - https://www.youtube.com/@bradgarropy **QUESTIONS ABOUT MY SETUP** Check out my Uses page for my VS Code setup, what recording equipment I use, etc. https://www.jamesqquick.com/uses **STAY IN TOUCH 👋** Check out the Podcast - https://compressed.fm/ Courses - https://jamesqquick.com/courses Newsletter 🗞 - https://www.jamesqquick.com/newsletter Follow me on Twitter 🐦 - https://www.twitter.com/jamesqquick **DISCORD** Join the Learn Build Teach Discord Server 💬 - https://discord.gg/vM2bagU 00:00 - Intro 00:19 - What We'll Cover and Resources 01:35 - SvelteKit Folder Based Routing 02:05 - Loaders in SvelteKit 03:08 - Automatic PageData Types with SvelteKit 03:56 - Loading That Conference Speakers From Storyblok 04:19 - Storyblok Stories and Blocks 05:43 - The Speakers Story in Storyblok 06:50 - Rendering Speakers in SvelteKit 09:40 - Storyblok Visual Editor and Live Preview 11:30 - Wrap Up