mdx-js/mdx

MDX solves a common problem for developers who write documentation or content-heavy websites: standard Markdown is great for plain text but can't include interactive UI elements. MDX fixes that by letting you mix Markdown with JSX, the component syntax used in React and similar frameworks. You write prose like normal, but you can also drop in reusable components (like charts, alerts, or custom widgets) directly in your text file. The way it works is MDX compiles your .mdx files into JavaScript that frameworks like React, Preact, and Vue can render. It integrates with popular build tools like webpack and Rollup so it slots into existing project setups. Under the hood it uses the unified and remark ecosystem, which are JavaScript tools for processing text. You'd use MDX when building a documentation site, a blog, or any content-driven web app where you want interactive components alongside written content, without separating the two into different files. For example, embedding a live data chart inside a tutorial post. The tech stack is JavaScript, with support for JSX, React, Vue, webpack, and Rollup.