Markdown Explained - Benefits, Uses, and Capabilities

Markdown Explained - Benefits, Uses, and Capabilities

Posted on:February 18, 2023 at 10:00 AM

Markdown is a lightweight markup language used to format text in a plain text editor for easy conversion to HTML. It was originally created by John Gruber in 2004 as a way to write and format content for the web in a simple and readable way.

Markdown uses a syntax that is easy to remember and intuitive to use, with special characters and punctuation used to denote formatting elements such as headings, lists, bold and italic text, and links.

Table of Contents

Open Table of Contents

Why do we use markdown?

There are several reasons for using markdown as a developer. Here are few of them:

Easy to learn and use: Markdown is a simple markup language that is easy to learn and use, even for people with no prior programming experience. It has a simple syntax that is easy to remember, making it a popular choice for writers, bloggers, and content creators.

Platform-independent: Markdown files can be read and edited on any device or platform, as they are just plain text files. This makes it easy to collaborate with others who may be using different devices or software.

Universally compatible: Markdown files can be easily converted to HTML, PDF, or other formats, making them highly compatible with a wide range of tools and platforms.

Focus on content: Markdown allows writers to focus on the content, rather than worrying about formatting. It helps to keep the content simple, while still allowing for basic formatting and organization.

Consistency: Markdown provides a consistent style and structure to the content, making it easy to maintain and update over time. It also helps to ensure that the content looks the same across different devices and platforms.

Overall, Markdown is a powerful and flexible tool that helps content creators write and format text in a simple and consistent way, making it a popular choice for writers, bloggers, and developers alike.

What can we do with markdown?

Markdown can be used to format text in a variety of ways, including:

Headings:

Use hash symbols to denote heading levels, from H1 (#) to H6 (######).

# H1 Heading
## H2 Heading
### H3 Heading

Paragraph:

Simply type text to create a paragraph.

This is a paragraph of text.

Lists

Create ordered or unordered lists.

- Unordered list item 1
- Unordered list item 2
- Unordered list item 3

1. Ordered list item 1
2. Ordered list item 2
3. Ordered list item 3

Result:

  • Unordered list item 1
  • Unordered list item 2
  • Unordered list item 3
  1. Ordered list item 1
  2. Ordered list item 2
  3. Ordered list item 3

Emphasis

Use asterisks or underscores to make text italic or bold.

*Italic text*
**Bold text**

Create links to other web pages or documents.

[Link text](https://www.example.com)

Result

Link text

Images

Add images to your document.

![Alt text](/path/to/image.jpg)

Result

Alt text

Code blocks

Format code snippets and blocks of code.

Inline code print("Hello World").

class MyClass {
  private $config;

  public function __construct($config) {
    $this->config = $config;
  }

  public function getConfig() {
    return $this->config;
  }
}

Tables

Create tables with columns and rows.

| Column 1 | Column 2 | Column 3 |
|----------|----------|----------|
| Row 1    | Row 1    | Row 1    |
| Row 2    | Row 2    | Row 2    |
| Row 3    | Row 3    | Row 3    |

Result

Column 1Column 2Column 3
Row 1Row 1Row 1
Row 2Row 2Row 2
Row 3Row 3Row 3

Horizontal rules

Create a horizontal rule to separate sections of text with three or more dashes, asterisks, or underscores.

---

Result


Task lists

Create a list of items with checkboxes.

- [x] Item 1
- [ ] Item 2
- [ ] Item 3

Footnotes

Add footnotes to your document by using a caret symbol and a label.

This is some text[^1].

[^1]: This is a footnote.

Mermaid diagrams

Create diagrams using Mermaid syntax.

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

Result

graph TD; A-->B; A-->C; B-->D; C-->D;

Custom CSS styling

Apply custom CSS styling to your Markdown document.

<style>
h1 {
  color: red;
}
</style>

# My Heading

This is my content.

I have a specific video in Bengali language on it. You can take a look if you wish:

https://www.youtube.com/watch?v=7oyff_deyAQ