Dynamic routes are common in every web application with dynamic content. For example, if a user has a "slug" (meaning a named URL for that user) of my-pretty-name and the URL is /users/my-pretty-name, we want to be able to support that in Svelte. We can easily do this in SvelteKit by using dynamic routes. Dynamic routes are files named with brackets around it, so something like routes/users/slug.svelte. In this episode I show how we can set this up and use this easily in SvelteKit.
🤯 Support on Patreon

• https://www.patreon.com/davidwparker

⏱️ Timestamps:

• 00:00 - Introduction
• 00:30 - Demo
• 01:10 - SvelteKit config changes
• 01:40 - Package.json changes
• 02:20 - app.html markdown CSS changes
• 03:00 - $error.svelte changes
• 03:30 - index.svelte changes - using sveltekit:prefetch
• 04:40 - SvelteKit docs
• 06:15 - slug (dynamic routing) file!

💌 Newsletter:

• https://www.programmingtil.com/

🪐Elsewhere:

• Twitter: https://twitter.com/davidwparker
• Twitter: https://twitter.com/programmingtil
• GitHub: https://github.com/davidwparker

💭Concepts:

• Dynamic Routes in SvelteKit

📚Resources:

• https://github.com/davidwparker/programmingtil-svelte/tree/ep17
• https://kit.svelte.dev/docs#routing-pages

🎬 Subscribe!

• http://bit.ly/subdavidwparker

My name is David W Parker and I’m creating and publishing videos on ProgrammingTIL to help teach anyone and everyone who wants to code. I’m a huge fan of Ruby on Rails, Svelte, TailwindCSS, and WebGL. I’ve used React a lot in the past, as well as some Vue and AngularJS. I’ve done some professional Python and Django. I like to create real applications and my tutorials will walk you through how to build something real from beginning-to-end.

svelte #sveltekit