Intro to Markdown

Intro

Markdown is a light-weight syntax for writing formatted text. It allows you to add styling to text without having to distract and click on any buttons, which makes it a great tool for writing docs and note taking.

Syntax

Headings

Add 1-6 <kbd>#</kbd> and a space before text to make it a heading.


# H1
## H2
### H3
#### H4
##### H5
###### H6

H1

H2

H3

H4

H5

H6

Inline Formatting

You can wrap words or sentences in special characters to apply style.

Style	Syntax	Example	Output
Bold		This is bold text	This is bold text
Italic	* * or _ _	This text is italicized	This text is italicized
Strikethrough	~~ ~~	\~\~This was mistaken text\~\~	~~This was mistaken text~~
All bold and italic	* *	*Important text*	Important text
Inline Code	` `	`console.log("hello")`	`console.log("hello")`
Emoji	:emoji:	`:rocket:`	🚀
Equation	$ $	$e^{ix}=\cos x+i\sin x$

Link

Wrap text in [ ] followed by a URL in ( ) to write a link.


[click here](<https://www.youtube.com/watch?v=dQw4w9WgXcQ>)

Please don't click here

Image

Add a ! before a link to display a image.


![college life](<https://media.giphy.com/media/X3Yj4XXXieKYM/giphy.gif>)

Alternative text inside the [ ] is displayed when the image fails to load.

Blockquote

Add > and a space to quote something.


> Any application that can be written in JavaScript, will eventually be written in JavaScript.  (Jeff Atwood, 2007)

Any application that can be written in JavaScript, will eventually be written in JavaScript. (Jeff Atwood, 2007)

Code Block

Use triple backticks `\`` to format code or text into its own distinct block.

To add syntax highlighting, specify a language next to the first 3 backticks.


```javascript
function sleepSort(array) {
  array.forEach((x) =>
    setTimeout(() => console.log(x), x * 1000)
  );
}
```


function sleepSort(array) {
  array.forEach((x) =>
    setTimeout(() => console.log(x), x * 1000)
  );
}

List

Unordered List

Add -, +, or * and a space before text to create a bullet point.


- Item 1
- Item 2
  - Item 2a
  - Item 2b
- Item 3

Item 1

Item 2

Item 2a
Item 2b

Item 3

Ordered List

Add numbers and a period before text to create a numbered list.


1. Item 1
2. Item 2
   1. Item 2a
   2. Item 2b
3. Item 3

Item 1

Item 2

Item 2a
Item 2b

Item 3

Todo List

Use - [ ] or - [x] to create a task list.


- [x] Finish my changes
- [ ] Push my commits to GitHub
- [ ] Open a pull request

Finish my changes

Push my commits to GitHub

Open a pull request

Table

Use | to separate table columns. Put --- below the first row to indicate that it's the header.

Optionally, you can use : to align a column to the left, right, or center.


| Name      | Code  |      Price |
| --------- | :---: | ---------: |
| Bitcoin   |  BTC  | $18,982.73 |
| TerraLUNA | LUNA  |  $0.000396 |

Name	Code	Price
Bitcoin	BTC	$18,982.73
TerraLUNA	LUNA	$0.000396

HTML

You can also use HTML directly in Markdown. This allows for more complex formatting.


<details>
  <summary>Click to expand</summary>

  ### Heading
  1. Foo
  2. Bar
     * Baz
     * Qux

</details>

Heading

Escape Characters

To display a literal character that would otherwise be used for formatting, add a backslash \ before it.


\*literal asterisks\*

\*literal asterisks*\

Best Practices

1. Leave a blank line between paragraphs

✅ Do This	❌ Not That
Paragraph 1 Paragraph 2	Paragraph 1 Paragraph 2

2. Add a space between prefix literals and text

✅ Do This	❌ Not That
# Title 3. Item	#Title 3.Item

References

Writing on GitHub - GitHub Docs

Markdown Cheatsheet

Markdown Guide