Adding Redirects with Netlify
While sharing out my twitch stream link on Twitter, I ended up initially sharing the wrong user (I was off by one letter). This made me realize I never want to type this out myself ever again. I went to Netlify to solve this for me!
Netlify offers two ways to configure your redirects:
I decided to choose the latter option (#2). In there, we can tell the browser if we see a request from the left column that it should go to the one on the right:
# in static/_redirects# If we see prince.dev/twitch change it to https://twitch.tv/maxcellw/twitch https://twitch.tv/maxcellw
This way I can share out https://prince.dev/twitch and that will take you to my Twitch stream!
If you've come to my site before, I used to post all my topics under
I've decided that everything should just live at the top-level so it is just the slug.
While making the content on my site do this is as easy as changing one line of code, I want
to be also sure that any links to my blog posts aren't broken. This is where we can also use a redirect:
# in static/_redirects/twitch https://twitch.tv/maxcellw/blog/* /:splat
This uses a splat operator(*) that will match to anything following the
/blog/ pattern. That gets saved into
:splat placeholder and then we can just tell our site that it should take us to the top-level verison
like we want.
If any user clicks on a link on any other site that maybe were to take us to
it will go to
prince.dev/netlify-redirects instead. Which is what we want!
There are a ton of options that you can look into on Netlify's site as well if you want to learn more about redirects. I know that Kent C. Dodds also loves using Netlify and built a tool to support sharing more content with their own URL shortener.