Articles Tagged markdown

MDX is a killer feature for things like blogs, slide decks and component documentation. It allows you to write Markdown without worrying about HTML elements, their formatting and placement while sprinkling in the magic of custom React components when necessary.

Let’s harness that magic and look at how we can customize MDX by replacing Markdown elements with our own MDX components. In the process, we’ll introduce the concept of “shortcodes” when using those components.

As a heads up, the code … Read article “Working With MDX Custom Elements and Shortcodes”

Markdown has traditionally been a favorite format for programmers to write documentation. It’s simple enough for almost everyone to learn and adapt to while making it easy to format and style content. It was so popular that commands from Markdown have been used in chat applications like Slack and Whatsapp as document applications, like Dropbox Paper and Notion. When GitHub introduced Markdown support for README documentation, they also rendered HTML content from it — so, for example, we could drop … Read article “An Introduction to MDXJS”

Markdown supports HTML, so if you need to, say, embed a YouTube video, you can just copy and paste the embed code from them, drop it into a Markdown document, and you should be good to go. With YouTube specifically, there are other options. But in general, you don’t need to do anything special to embed third-party media in Markdown.

You do need to do whatever is necessary for that particular service though. For example, on CodePen, you visit … Read article “Embedded Content in Markdown”

One of the more powerful concepts I’ve stumbled across recently is the idea of abstract syntax trees, or ASTs. If you’ve ever studied alchemy, you may recall that the whole motivation for alchemists was to discover some way to transform not-gold into gold through scientific or arcane methods.

ASTs are kind of like that. Using ASTs, we can transform Markdown into HTML, JSX into JavaScript, and so much more.… Read article “How to Modify Nodes in an Abstract Syntax Tree”

You can have the best open source project in the world but, if it doesn’t have good documentation, chances are it’ll never take off. In the office, good documentation could save you having to repeatedly answer the same questions. Documentation ensures that people can figure out how things work if key employees decide to leave the company or change roles. Well documented coding guidelines help bring consistency to a codebase.

If you’re writing long-form text, Markdown is clearly a great … Read article “Front-End Documentation, Style Guides and the Rise of MDX”

Pretty specific, huh? While we’re going to do exactly what the title says, this post is more about a learning exercise and an example of getting help on the internet.… Read article “Creating Cue Files from Markdown”

This is mostly for me. These are the little things that sometimes confuse me about Markdown and I find myself having to search the web for. So I’ll write them down. Blogging as memory extension.

Know that your mileage may vary on this stuff, as there are many varietals of Markdown.… Read article “Little Stuff about Markdown I Always Forget and have to Google”

A huge high-five to John James Jacoby for his help here on CSS-Tricks fixing up our Markdown + bbPress integration. John runs Plugins Loaded, a source of high-quality WordPress plugins that you can use for free, or choose to pay to support.

Maybe you’ll read that title and think:

Damn, Chris. Little dogmatic isn’t it? There are lots of ways to do things, especially on the web. Why be all prescriptive?

You’d be right. What I actually want is for everyone creating content on the web to create that content in a clean way that will serve them long into the future. Markdown, I feel, highly encourages that.

Let us explore some of those ways.

If you have no idea what Markdown … Read article “You Should Probably Blog in Markdown”