What is Markdown?
According to Wikipedia:
Markdown is a lightweight markup language for creating formatted text using a plain-text editor. John Gruber and Aaron Swartz created Markdown in 2004 as a markup language that is appealing to human readers in its source code form. Markdown is widely used in blogging, instant messaging, online forums, collaborative software, documentation pages, and readme files.
A markdown file has .md extension and we can write and design text or useful information by following the basic syntaxes. It’s very popular and easy to use.
HTML tags are also supported in markdown.
Use Case
Markdown syntax is used in various popular places nowadays. You can also make websites using markdown files. This can be done using docsify.
Some popular platforms that use Markdown syntaxes and files are as follows -
- GitHub
- Hashnode
- Dev.to
- Discord and many other platforms.
Basic Syntaxes
Headings
Syntax:
# H1 - Heading 1
## H2 - Heading 2
### H3 - Heading 3
#### H4 - Heading 4
##### H5 - Heading 5
###### H6 - Heading 6
Output:
H1 - Heading 1
H2 - Heading 2
H3 - Heading 3
H4 - Heading 4
H5 - Heading 5
H6 - Heading 6
--
Text
Syntax:
- Strikethrough Text
Syntax:
Strikethrough uses two tildes. ~~Scratch this.~~
output:
Strikethrough uses two tildes. Scratch this.
- Blockquote Text
output:
> “I'm unpredictable, I never know where I'm going until I get there, I'm so random, I'm always growing, learning, changing, I'm never the same person twice. But one thing you can be sure of about me; is I will always do exactly what I want to do.”
output:
“I'm unpredictable, I never know where I'm going until I get there, I'm so random, I'm always growing, learning, changing, I'm never the same person twice. But one thing you can be sure of about me; is I will always do exactly what I want to do.”
- Bold
Syntax:
**DO NOT UNDERESTIMATE THE POWER OF A PROGRAMMER.**
output:
DO NOT UNDERESTIMATE THE POWER OF A PROGRAMMER.
- Italic
Syntax:
*It is Written in Italics*
output:
It is Written in Italics
- Bold and Italic
Syntax:
***You Can Combine Bold and Italics***
output:
You Can Combine Bold and Italics
- Highlight
To highlight a text, wrap it in == from both sides. For example, the following markdown:
Syntax Example:
I love ==markdown==
output:
I love ==markdown==
-
Footnote
Syntax:
Here's a sentence with a footnote. [^1]
[^1]: This is the footnote.
output:
- Emojis
Syntax:
:mango: :lemon: :man: :car:
output:
🥭 🍋 👨 🚗
Links
- Embedded Links Into Text
Syntax:
[Github](https://github.com/)
output:
Github
- Image
Syntax:
output:
- Embed YouTube Video
Syntax:
[](YOUTUBE VIDEO LINK)
output
- Embed GIF
Syntax:
output
- Horizontal Line
Syntax:
---
output
Code
This can be written in 2 ways - Inline code and normal code
Syntax for inline code:
Inline `code` has `back-ticks around` it.
Output:
Inline code has back-ticks around it.
Syntax for normal code:
Blocks of Code
```javascript var s = "JavaScript syntax highlighting"; alert(s); ``` ```python s = "Python syntax highlighting" print s ``` ``` No language indicated, so no syntax highlighting. But let's throw in a tag. ```
- HTML
Syntax:
<p align="center">
Yes, you can use allowed raw HTML in mark-down file.
This is a paragraph aligned in the center.
</p>
```
`Output:`
<p align="center">
Yes, you can use allowed raw HTML in mark-down file.
This is a paragraph aligned in the center.
</p>
## Lists
#### Ordered Lists
`Syntax:`
```markdown
1. First item
2. Second item
3. Third item
```
`Output:`
1. First item
2. Second item
3. Third item
#### Unordered Lists
`Syntax:`
```markdown
- First item
- Second item
- Third item
```
`Output:`
- First item
- Second item
- Third item
- To define a sub list
`Syntax:`
```markdown
* data 1
* data 2
* data 21
* data 22
* data 3
```
`Output:`
* data 1
* data 2
* data 21
* data 22
* data 3
### Task List
`Syntax:`
```
- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media
```
`Output:`
- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media
# Table
`Syntax:`
```markdown
| Fruit | Emoji |
| ----- | ------- |
| Mango | :mango: |
| Lemon | :lemon: |
```
`Output:`
| Fruit | Emoji |
| ----- | ------- |
| Mango | :mango: |
| Lemon | :lemon: |
- ***Table With Alignments***
`Syntax:`
```markdown
| Fruit(left) | Emoji(center) | Taste(right) |
| :-------------------------- | :-----------: | ------------------------: |
| Mango is the king of Fruits | :mango: | Sweet and I love it |
| Lemon is good for health | :lemon: | Sour, mix it in the water |
```
`Output:`
| Fruit(left) | Emoji(center) | Taste(right) |
| :-------------------------- | :-----------: | ------------------------: |
| Mango is the king of Fruits | :mango: | Sweet and I love it |
| Lemon is good for health | :lemon: | Sour, mix it in the water |
# Mathematical Expressions
1.### Inline expressions:
`Syntax:`
```markdown
$<<mathematical expression>>$
```
`Output:`
Replace `<<mathematical expression>>` with your expression.
`Example`
`Syntax:`
```markdown
$\sqrt{3}+1$
```
`Output:`
2. ***Block Expressions***:
`Syntax:`
```markdown
$$<<mathematical expression>>$$
```
`Example`
$$\sqrt{3}+1$$
`output`
3. ***Mixed Expressions***:
`Syntax`
```markdown
When $a \ne 0$, there are two solutions to $(ax^2 + bx + c = 0)$ and they are
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
```
`output`
- [Mathematical Equations github](https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/writing-mathematical-expressions)
- [Mathematical formulas](https://en.wikibooks.org/wiki/LaTeX/Mathematics)
### Conclusion
This is a comprehensive list for you all as your guide. Hope all went well and you enjoyed the article.
Hope this helps you. Thank you for reading, and let’s connect!
Top comments (0)