this post demonstrates the various features available when writing with mdx.

mathematics

mdx supports latex math expressions through katex:

block math

the fourier transform:

F(f)(ξ)=∫−∞∞f(x)e−2πixξdx\mathcal{F}(f)(ξ) = \int_{-\infty}^{\infty} f(x) e^{-2\pi i x ξ} dx

inline math

you can also include inline math like ∑i=1nxi\sum_{i=1}^{n} x_i within paragraphs.

code highlighting

javascript

function fibonacci(n) {
  if (n <= 1) return n;
  return fibonacci(n - 1) + fibonacci(n - 2);
}

console.log(fibonacci(10)); // 55

python

def quicksort(arr):
    if len(arr) <= 1:
        return arr
    
    pivot = arr[len(arr) // 2]
    left = [x for x in arr if x < pivot]
    middle = [x for x in arr if x == pivot]
    right = [x for x in arr if x > pivot]
    
    return quicksort(left) + middle + quicksort(right)

# Example usage
numbers = [3, 6, 8, 10, 1, 2, 1]
print(quicksort(numbers))

rust

fn main() {
    let numbers = vec![1, 2, 3, 4, 5];
    
    let doubled: Vec<i32> = numbers
        .iter()
        .map(|x| x * 2)
        .collect();
    
    println!("{:?}", doubled); // [2, 4, 6, 8, 10]
}

tables

languageparadigmmemory safe
rustsystemsyes
javascriptmultino
pythonmultino
haskellfunctionalyes

lists and formatting

unordered lists

  • bold text for emphasis
  • italic text for subtle emphasis
  • inline code for technical terms
  • strikethrough for corrections

ordered lists

  1. first item with detailed explanation
  2. second item with more content
  3. third item to complete the set

nested lists

  • programming languages
    • systems programming
      • rust
      • c++
      • go
    • web development
      • javascript
      • typescript
      • python

blockquotes

"the best programs are written so that computing machines can perform them quickly and so that human beings can understand them clearly."

— donald knuth

check out these resources:

horizontal rules

that's a horizontal rule above this line.

conclusion

mdx provides a powerful way to write content that combines the simplicity of markdown with the flexibility of react components. perfect for technical blogs and documentation!