📂 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 #

🖥 Code #

<script context="module">
  export async function load({ page }) {
    const { slug } = page.params;
    return {
      status: 301,
      redirect: `/${slug}`,
    };
  }
</script>

🔗 Links #

• MDsveX Starter blog on Rodney Lab Git Hub ,
• 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.

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 Gatsby JS among other topics. Also subscribe to the newsletter to keep up-to-date with our latest projects.