This is a Next.js project with comprehensive MDX, Markdown, and Math support.
- 📝 Full Markdown Support - All standard markdown elements
- 🧮 LaTeX Math Equations - Both inline (
$...$) and block ($$...$$) equations with KaTeX - 📊 GitHub Flavored Markdown - Tables, task lists, strikethrough, footnotes
- 🎨 Beautiful Styling - Tailwind CSS with custom components
- 🖼️ Optimized Images - Next.js Image component integration
- 📚 MDX Components - Interactive React components in markdown
- Inline:
$E = mc^2$→$E = mc^2$ - Block equations with full LaTeX support
- Matrices, integrals, summations, and more
- All heading levels (H1-H6)
- Lists (ordered, unordered, nested, task lists)
- Tables with alignment
- Code blocks with syntax highlighting
- Blockquotes and collapsible sections
- Footnotes and references
- And much more!
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.
This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.
Visit /blog to see a comprehensive demonstration of all markdown and math features. The sample blog includes:
- All markdown syntax elements
- Mathematical equations (inline and block)
- Complex tables and task lists
- Code examples in multiple languages
- Collapsible sections
- Footnotes and references
See MARKDOWN_MATH_GUIDE.md for detailed documentation on using all features.
@next/mdx- MDX support for Next.jsremark-math- Parse math in markdownrehype-katex- Render math with KaTeXremark-gfm- GitHub Flavored Markdown support
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.