Test MDX Rendering

This is a test page to show how image and video links are automatically rendered.

Image Examples

Here are some image links that will render as actual images:

Third-Party Image

Here's an external image from a third-party service:

Video Examples

Here are some video links that will render as actual video players:

Mixed Content

You can also include regular text and other markdown elements:

• Bold text and italic text
• Regular links work normally
• Inline code is preserved

Code Blocks

// Code blocks work normally
const imageUrl = '/images/example.jpg';
console.log('This is preserved as code');

Lists and Formatting

Unordered List

• First item
• Second item
• Third item

Ordered List

1. Step one
2. Step two
3. Step three

Blockquotes

This is a blockquote example that shows how different markdown elements are rendered.

How It Works

• Images (.jpg, .png, .svg, etc.) render as actual images
• Videos (.mp4, .webm, etc.) render as actual video players with controls
• External images from third-party services work seamlessly
• Other files render as regular links
• All media is properly embedded and playable

That's it!

This demonstrates how the MDX renderer intelligently handles different file types:

• Images display normally (including external ones)
• Videos show as actual video players with controls
• Users can play videos directly in the browser
• Everything works seamlessly without HTML tags