Advanced MDX Formatting Test
Introduction
Testing out the new next-mdx-remote integration for this blog. We should see the estimated reading time above, and a sticky Table of Contents to the right!
Callout Alerts
We now have custom <AlertBox> components for different severity levels:
Important Note: MDX allows us to use standard markdown syntax inside of our React components!
Warning: Hardcoded secrets were detected in the previous commit.
Critical Vulnerability: Unauthenticated Remote Code Execution found on port 443.
Mitigated: The vulnerability has been successfuly patched.
Code Diffs
When writing security reports, it is often helpful to show exactly what changed to fix a vulnerability. Here is the new <CodeDiff> component:
Interactive Terminal
We also added a <Terminal> component to mock OS-level command execution outputs:
Wrapping Up
Everything seems to be working perfectly! The ToC should be correctly tracking our h1, h2, and h3 headers, and our custom React tags are rendering natively securely on the server side.