Introducing MDX-Bundler

3 Minutes with Kent

Hey there friends. I'm just out doing some shopping and I thought I'd record today so right now I just want to talk about MDX Bundler. This is a open source library that I just created. Yeah a couple days ago and it's pretty cool. Basically a lot of packages and things that you have for compiling MDX.

Oh actually if you have never heard of MDX, it's like marked down except it allows you to import react components and render those and what's awesome about that does it means that you.Get all the benefits of easy content creation and and management with markdown because it's just such a nice syntax for that.

But then you get all of the flexibility of react components and so you can have really cool demos and things that are kind of interleaved with all the content that you've got. So MDX Bundler.Is kind of unique because it enables you to bundle all the dependencies for a particular post because what with MDX what you're looking at is actually like JavaScript.

That's what it needs to get compiled into. And JavaScript often has to benefit. So, of course, it'll have react as it dependency because this it's going to render react components. But then like maybe you're rendering a D3 chart and so then you've got D3 in there, and maybe you're using some sort of library to like load ash or something like that.

So you've got,Dependencies and most MDX compilers won't handle those. But like, I mean, you've got Gatsby and everything and next like pretty much everywhere it ends up being put together in tandem with a another framework or something but this is totally meta framework agnostic where you're able to have it generate the code and you have control over whether certain things are considered global variables or whatever and so you generate this code either during build time or on the server you send that to your client or even ifIt's server side rendered then you'd send it to the client which is being rendered on the server.

And and then you'd provide any of those libraries as quote unquote global variables. They're not actually globally because you're actually passing them as variables. Anyway, the example in the readme is a pretty straightforward hopefully so if if that didn't make any sense you can go take a look at that.

But I'm excited about NDX Bendler. I'm gonna be using it for my blog that I'm rebuilding in Remix and it just makes things really quite nice.Actually. So go ahead and give that a look. It's MDX Bundler on my github, and I hope that's interesting. Bye.