Opens an external site in a new window
Mental Health Awareness Month
“Community”
RODNEY LAB
  • Home
  • Plus +
  • Newsletter
  • Links
  • Profile
RODNEY LAB
  • Home
  • Plus +
  • Newsletter
  • Links

SvelteKit File Based Routing Explained # SvelteKit File Based Routing Explained #

blurry low resolution placeholder image Open Graph SEO in SvelteKit
  1. Home Rodney Lab Home
  2. Blog Posts Rodney Lab Blog Posts
  3. SvelteKit SvelteKit Blog Posts
<PREVIOUS POST
NEXT POST >
LATEST POST >>

SvelteKit File Based Routing Explained #

Published: 4 years ago
2 minute read
Gunning Fog Index: 6.8
Content by Rodney
blurry low resolution placeholder image Author Image: Rodney from Rodney Lab
SHARE:

📂 SvelteKit File Based Routing: Introduction #

In this video, we use SvelteKit file based routing to solve the problem of migrating your blog post paths from one path system to another. Along the way we see how to use load functions and implement redirects in SvelteKit as well as see how SvelteKit's Filesystem routing works.

Just for anyone used to American pronunciation, I pronounce the word “routing” like “rooting” in this video (that is, the British pronunciation), hope that's not too confusing!

📹 SvelteKit File Based Routing: Video #

Please enable JavaScript to watch the video 📼

SvelteKit File Based Routing Explained

🖥 Code #

src/routes/[year]/[month]/[day]/[slug]/index.svelte
svelte
    
<script context="module">
export async function load({ page }) {
const { slug } = page.params;
return {
status: 301,
redirect: `/${slug}`,
};
}
</script>
Redirect code from the SvelteKit File Based Routing Video.

🔗 Links #

  • MDsveX Starter blog on Rodney Lab GitHub ,
  • SvelteKit docs on Routing  ,
  • SvelteKit docs on load functions  ,
  • Twitter handle: @askRodney .

🙏🏽 SvelteKit File Based Routing: Feedback #

If you have found this video useful, see links below for related content on this site. I do hope you learned one new thing from the video. Let me know if there are any ways I can improve it. I hope you will use the code or starter in your own projects. Be sure to share your work on Twitter, giving me a mention, so I can see what you did. Finally, be sure to let me know ideas for other short videos you would like to see. Read on to find ways to get in touch, further below. If you have found this post useful, even though you can only afford even a tiny contribution, please consider supporting me through Buy me a Coffee.

blurry low resolution placeholder image ask Rodney X (formerly Twitter) avatar

Rodney

@askRodney

Here's a short video which takes a look at SvelteKit's file based routing system, with an example of migrating your blog's url path format in your ❤️ Svelte site. I hope you find it useful.

https://t.co/OAEtukYoJH #askRodney #svelteKit @sveltejs @SvelteSociety

— Rodney (@askRodney) July 2, 2021

Finally, feel free to share the post on your social media accounts for all your followers who will find it useful. As well as leaving a comment below, you can get in touch via @askRodney on Twitter and also askRodney on Telegram . Also, see further ways to get in touch with Rodney Lab. I post regularly on SvelteKit as well as Astro among other topics. Also, subscribe to the newsletter to keep up-to-date with our latest projects.

Thanks for reading this post. I hope you found it valuable. Please get in touch with your feedback and suggestions for posts you would like to see. Read more about me …

blurry low resolution placeholder image Rodney from Rodney Lab
TAGS:
SVELTEKIT

Reposts:

Reposts

  • Svelte Society 🧡 profile avatar

Likes:

Likes

  • Bill Tihen profile avatar
  • David Stevens profile avatar
  • jon palacio profile avatar
  • MCMY profile avatar
  • Morgan profile avatar
  • The Retard profile avatar
  • Noel profile avatar
  • Michael Bloomfield profile avatar
  • Stephen Strickland profile avatar
  • Taylor Ray profile avatar
  • Svelte Society 🧡 profile avatar
Reposts & likes provided by Mastodon & X via Webmentions.

Related Posts

blurry low resolution placeholder image MDsveX rehype Plugins: Pimp your Blog Posts

MDsveX rehype Plugins: Pimp your Blog Posts

sveltekit
<PREVIOUS POST
NEXT POST >
LATEST POST >>

Leave a comment …

Your information will be handled in line with our Privacy Policy .

Ask for more

1 Nov 2022 — Astro Server-Side Rendering: Edge Search Site
3 Oct 2022 — Svelte eCommerce Site: SvelteKit Snipcart Storefront
1 Sept 2022 — Get Started with SvelteKit Headless WordPress

Copyright © 2020 – 2025 Rodney Johnson. All Rights Reserved. Please read important copyright and intellectual property information.

  • Home
  • Profile
  • Plus +
  • Newsletter
  • Contact
  • Links
  • Terms of Use
  • Privacy Policy
We use cookies  to enhance visitors’ experience. Please click the “Options” button to make your choice.  Learn more here.