---
title: 'MDX - I should have done this sooner'
date: 2020-07-22
excerpt: 'I added support for mdx to my site, and it''s made life much bettter.'
tags: [productivity, dev]
canonical: https://mikebifulco.com/posts/moving-to-mdx
---
# MDX - I should have done this sooner

As of *this very post,* I've added support for [MDX](https://www.gatsbyjs.org/docs/mdx/plugins/) to my site. It should make writing new content *much* easier for me. By removing lots of process that has proven unnecessary, I'll be able to get back to writing more here, an I'm very excited about that.

And it works great! Here's an example of a custom shortcode I wrote, called `<Aside />`:

> These can be used to highlight important things.

And the relevant code for Aside:

```jsx {1,3}
const Aside = (props) => {
  const theme = useTheme();
  return (
    <Box
      borderLeft="8px solid"
      padding="1rem 0 1rem 2rem"
      borderColor={theme.colors.pink[400]}
      backgroundColor={theme.colors.pink[50]}
      margin="2rem 0 2rem 0rem"
      {...props}
    />
  );
};
```

Its use is fairly simple, too -

```jsx
<Aside>These can be used to highlight important things.</Aside>
```

# h/t

This is on the heels of last night's (now defunct) Reactadelphia Meetup, where a very talented developer named [Prince](https://prince.dev/) gave a fantastic talk on MDX. I found it particularly inspiring -- it was that rare talk which had substance *and* motivation. I already had a pretty good grasp of what one might use MDX for in practice, but Prince made some great points about why MDX is such a game changer.

## More from mikebifulco.com

- [Massively speed up VS Code loading time on Apple Silicon Macs in one step](https://mikebifulco.com/posts/make-vs-code-load-faster-mac-apple-silicon)
- [How to make VS Code load faster with a little bit of housekeeping](https://mikebifulco.com/posts/make-vs-code-load-faster-by-removing-extensions)
- [Do you have your own Gatsby site? Let's brainstorm a dev.to cross-poster](https://mikebifulco.com/posts/gatsby-dev-to-cross-poster-brainstorm)

---

Written by Mike Bifulco. Originally published at https://mikebifulco.com/posts/moving-to-mdx