What is Markdown

It’s been a while creating content, got busy with my office work & my brother’s marriage. Now i’m back

Markdown is a lightweight markup language that simplifies text formatting without the complexity of HTML elements. It offers an intuitive approach to content management with robust ecosystem support. For software developers, mastering Markdown can be incredibly beneficial!

Where Markdown is Used

• Widely adopted in the Software Development field
• Powers documentation sites, such as ContentQL docs
• Fundamental to many blogging platforms, including my own website
• Extensively used in GitHub Pull Requests

Syntax

<!-- These are heading we've from h1 to h6 similar to HTML -->
<!-- Heading will start with # your-text -->

# Heading 1

## Heading 2

### Heading 3

<!-- This is external link similar to <a> tag in HTML -->

[contentql docs](https://contentql.io/docs)

<!-- This is image with alt text, it'll have "!" symbol at beginning -->

![Under the hood](/blog/what-i-do-for-living/under-the-hood.avif)

<!-- This is unordered list -->

- item 1
- item 2
- item 3

preview of the above syntax👇

Heading 1

Heading 2

Heading 3

contentql docs

• item 1
• item 2
• item 3

I’ve demonstrated the syntax for a few elements, but Markdown offers much more. For a comprehensive guide, Check out markdownguide

How markdown works🤔

The process is straightforward: Markdown syntax is parsed and converted back to HTML for web rendering

example: markdown -> markdown-parser -> HTML output

Extensions & Plugins

MDX

• A superset of Markdown that allows direct importing of React components
• Uses .mdx extension, compared to Markdown’s .md
• Enhances interactivity of static content by integrating React components
• Learn more at MDX

Remark

• A powerful tool for Markdown transformations
• Offers numerous plugins for formatting, such as remark-gfm (GitHub Flavored Markdown)
• Learn more at Remark

Bonus

• Markdown live preview for real-time content editing
• MDX VSCode plugin for enhanced syntax highlighting