Introdução ao MDX

Traduzido por: Cristhyan Couto.

MDX é uma ferramenta poderosa que permite escrever JSX nos seus arquivos Markdown. Esse post ira introduzi-lo ao básico do MDX.

O que é MDX?

MDX é um formato de arquivo que te permite usar JSX ou TSX dentro dos seus arquivos Markdown. Isso significa que você pode usar componentes React, importar outros compones e até mesmo escrever JSX dentro dos arquivos Markdown.

export async function getSource() {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  return data;
}

Por que usar MDX?

MDX é maravilhoso para escrever documentação interativa, publicações de blogs, e outros conteúdos que precisam de mais do que apenas texto. Usando MDX, você pode facilmente integrar componentes interativos, trechos de código, e outros conteúdos dinâmicos nos seus arquivos Markdown.

Como usar o MDX

Para usar o MDX, você precisa instalar um plugin para o seu gerador de site estático ou sua ferramenta de "build". Por exemplo, se você estiver usando Gatsby, você pode usar o "gatsby-plugin-mdx" para ativar o suporte ao MDX no seu projeto.

Assim que o plugin for instalado, você pode começar a escrever arquivos MDX apenas criando arquivos com a extensão ".mdx" e escrevendo JSX dentro deles.

Conclusão

MDX é uma ferramenta poderosa que te permite escrever JSX nos seus arquivos Markdown. Esse post introduziu você ao básico do MDX e explicou o porque você talvez queira usar isso nos seus projetos.