Writing about code in Astro


One of the best things about Astro for a developer blog is built-in syntax highlighting for code blocks.

JavaScript Example

Here’s a simple JavaScript function:

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

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

TypeScript Example

And here’s some TypeScript with type annotations:

interface BlogPost {
  title: string;
  description: string;
  pubDate: Date;
  heroImage?: string;
}

const createPost = (post: BlogPost): void => {
  console.log(`Creating post: ${post.title}`);
};

Python Example

Works great with Python too:

def quick_sort(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 quick_sort(left) + middle + quick_sort(right)

print(quick_sort([3, 6, 8, 10, 1, 2, 1]))

The Best Part

Since this is MDX, you can even import and use React components inline if you need interactive examples!

Happy blogging!