Routify your app

Hamilton, Bermuda

Wherever possible, I try to write about things I care about or at have a personal interest in. Since my last issue, I’ve discovered a new library which has caused me to renew my interest in trying to create a Svelte-based project showcase site. Since most of my projects are in Svelte it makes sense. The library I’m referring to is Routify and combining that with mdsvex, I’m hoping to create something interesting.

Routify logo or screenshot


Routes for Svelte, automated by your file structure. A lot of client side routers require you to declare all of your routes via some configuration or directly in your code, and that works for some sites and applications, but Routify works by using your filesystem to define the routes. If you have a hello.svelte file in your pages folder, then you have a /hello route. If you’ve used Next.js or Nuxt.js they both use something similar. In this case Routify is really just the routing part, but the Routify team are working on a fuller featured application framework based on it.

mdsvex logo or screenshot


Combine Svelte and markdown in the same file. Live your dreams! Most people have used or at least heard of Markdown, but a while back someone decided to create MDX, which allows you to use React components inside your Markdown documents. Well, mdsvex is the Svelte version of that, preprocessing your Markdown into Svelte components. The recent version 0.8.0 release takes a big step forward in functionality and customization.

Svench logo or screenshot


A lightweight workbench to develop your Svelte components in isolation. A contraction of Svelte and workbench, Svench aims to provide a first class component development experience to Svelte. If you are familiar with Storybook, it is like that, but allowing the fully glory of Svelte. This project is still a work in progress, but one I will be keeping an eye one for sure.