Sample Blog Post

This is a simple blog post created for testing purposes. Here’s a sample image, link, and a blockquote to see how they render.

Introduction

In this post, we will discuss how to create and use MDX files in a Next.js application. MDX allows you to write JSX directly in your Markdown files, which is very useful for creating interactive content.

Image

Here's a sample image to test the Image component:

Links

You can include links in MDX content easily. Click here to learn more about Next.js.

Blockquote

This is a blockquote example to test the styling of quoted content.

Lists

• Unordered List Example:
  • Item 1
  • Item 2
  • Item 3

1. Ordered List Example:
   1. Sub-item 1
   2. Sub-item 2

Code Snippets

To test the code and pre components, here’s a sample JavaScript code snippet:

// JavaScript Example
const greet = (name) => {
  console.log(`Hello, ${name}!`);
};
greet("World");

Here’s some inline code as well: const sample = "Hello MDX!".

Conclusion

Explanation of Components

• Image: Tests image rendering, ensuring it pulls correctly from the /public folder and displays with the specified styles.
• Links: Tests link functionality and hover styling.
• Blockquote: Tests styling and formatting.
• Lists: Tests ordered and unordered list styles.
• Code Blocks: Tests both inline and block code rendering for syntax highlighting and responsive styling.