Devrim Mehmet Logo

MDX Kullanımı

1 dk okuma
MDX Kullanımı

'2026-01-11'

Bu tema, [@astrojs/mdx](https://docs.astro.build/en/guides/integrations-guide/mdx/) entegrasyonu ile birlikte gelir ve astro.config.mjs dosyanızda yapılandırılmıştır. MDX kullanmak istemezseniz, entegrasyonu konfigürasyon dosyanızdan kaldırarak devre dışı bırakabilirsiniz.

## MDX Nedir?

MDX, gömülü JavaScript ve JSX sözdizimini destekleyen özel bir Markdown çeşididir. Bu sayede [JavaScript ve UI Bileşenlerini Markdown içeriğine karıştırabilirsiniz](https://docs.astro.build/en/guides/markdown-content/#mdx-features) – örneğin interaktif grafikler veya uyarılar.

## Örnek

MDX içinde bir UI bileşenini nasıl içe aktarır ve kullanırız:

```markdown

import HeaderLink from '../../components/HeaderLink.astro';

<HeaderLink href="#" onclick="alert('tıklandı!')">

MDX içinde gömülü bileşen

</HeaderLink>

```

Bu sayfayı tarayıcıda açtığınızda aşağıdaki gibi tıklanabilir bir buton görmelisiniz.

## Daha Fazla Bağlantı

- [MDX Söz Dizimi Dokümantasyonu](https://mdxjs.com/docs/what-is-mdx)

- [Astro Kullanım Dokümantasyonu](https://docs.astro.build/en/guides/markdown-content/#markdown-and-mdx-pages)

- Not: [Client Directives](https://docs.astro.build/en/reference/directives-reference/#client-directives) interaktif bileşenler oluşturmak için hâlâ gereklidir. Aksi takdirde MDX içindeki tüm bileşenler statik HTML olarak render edilir.