Write better with MDX

Content Creation with MDX

@ Tutorial

Writing content in Dong Blog is a breeze thanks to MDX. It combines the simplicity of Markdown with the power of React components.

Markdown Basics

Standard Markdown syntax is fully supported:

  • Bold text and Italic text
  • Links🔗
  • Code blocks with syntax highlighting
  • Ordered and unordered lists

Custom Components

We’ve included several components to enhance your posts.

Sidenotes

Use sidenotes to provide extra context without breaking the flow of your writing.

Images

The theme automatically optimizes images using astro:assets. You can use the standard Markdown syntax or our PostImage component for more control.

![Alt text](../../assets/my-image.png)

Expressive Code

We use astro-expressive-code for beautiful, functional code blocks. It supports titles, line highlighting, and more.

example.js
console.log("This line is highlighted");

Creating a New Post

To create a new post, simply add a new .mdx file to src/content/post/[language]/. Make sure to include the required frontmatter fields.