Using MDX with Docz Has Never Been This Easy!

Using MDX with Docz Has Never Been This Easy!

Docz Cheatsheet

Code documentation seems to be a cumbersome process for most developers. However, with the right set of practices and manageable tools, the task gets a bit painless. For me, Docz is the go-to tool for documentation needs as it creates SEO-friendly, interactive, production-ready documentation sites in a heap of minutes. The Gatsby-powered OSS has helped me to cut down the overheads of building and maintain custom documentation sites. If you are an open-source contributor, you can contribute to Docz here.

mdx-and-docz.png

FYI- It is already popular on GitHub with 21k stars and 26k weekly downloads. In a nutshell, Docz is a zero-config, typescript-supported OSS with customisable themes and plugins to style your document.

The software uses MDX ( .mdx files) extensively to render desirable formatting features in your doc. For a heads-up, MDX is short for Markdown with JSX. It finds use cases in building React components to Markdown files and speeds up the document workflow. With MDX, you can make interactive charts, alert components and directly add them to your documentation. That’s how MDX does all the heavy-lifting formatting for your doc. Now that you have a fair idea about Docz and MDX, let’s dive deep into the integration- using Docz with MDX.

The Use Cases: Docz with MDX

uing-mdx-with-docz-has-never-been-this-easy.png

Did you ever stumble upon questions like “I want to build a new component for my new feature? Is it already there? If yes, what it does? Does it work the same I want it to be?” The foremost use-case of Docz and MDX is to create documentation that can be shared and used over and over by a developer network in an organisation.

You can also use the feature to build reusable React components for your front-end project. The combination also finds use in agile software development to bookmark several documentation phases including Implementation Details, SRS, Design Documents, Test Cases, and End User Documents.

If you are settled with Docz, use the tool to create an online resume. That’s how you have an edge to impress your interviewer and showcase your front-end skill.

Installations and Plugins

  1. Start by installing the Docz dependency to your project.
yarn add docz
  1. Or, with npm command
npm install docz

To read more, please visit Aviyel.