Getting started with Markdown (Cheatsheet)
Tags: beginners, webdev, tutorial
Published: 2020-02-19 19:27:58

---
title: Getting started with Markdown (Cheatsheet)
published: true
date: 2020-02-19 11:20:00 MST
tags: beginners, webdev, tutorial
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/ikgvt9mla517tlyceo3v.jpg
canonical_url: https://developerbacon.ca/articles/getting-started-with-markdown-cheatsheet/
---

> This article assumes that you don't know anything or very little about the Markdown language, or if you have just come to find out what you might have missed.

## [Why use Markdown?](#why-use-markdown)

Before we get into things let's talk about why you would want to use Markdown in the first place.

- A great reason for using markdown is that it's everywhere. Some examples of websites that use Markdown are Reddit, Github, Medium, Dev.to, etc... You can also use it for many things outside of the web like for documents, books, presentations, and emails.

- Because markdown is simple and easy to read it is future proof. If a website or service stops supporting Markdown you still have the formatted file.

## [The basics](#the-basics)

These tags are probably what you will be using for the most part and will be important to remember.

### [Headings](#headings)

Let's start at the beginning. To make a header or heading you add a `#` to the beginning of the line. One `#` is equivalent to an `<h1>` in HTML. To move down the line of headings you just add more `#`'s like so.

```markdown
# Heading 1

## Heading 2

### Heading 3

#### Heading 4

##### Heading 5

###### Heading 6
```

### [Paragraphs](#paragraphs)

Adding paragraphs is super simple. It is the default for writing with markdown. The only thing you need to do to write a paragraph is that you have nothing in front of your text.

```markdown
# Heading 1

I am a paragraph, I have nothing to identify anything else so I will default to a paragraph.

I am another paragraph.
```

### [Adding Links](#adding-links)

While using Markdown you may wish to add a link to some website, like Developer Bacon ;). To add a link you just need `[]()`. In the first square brackets, you will add the link text that shows on the websites, and for the round brackets that is where you add the link.

```markdown
I am a paragraph, here is my text. [I am a link](http://example.com)
```

Result:

I am a paragraph, here is my text. [I am a link](http://example.com)

For adding links you can also add the link directly like this:

```markdown
I am a paragraph, here is my text. http://example.com
```

### [Shopping Lists](#shopping-lists)

So make a list is as simple as adding a `-` or `1.` in front of some text. To make an ordered list you will just number the text like the below.

```markdown
# Todo

1. Make some Bacon
2. Laundry
3. Vacuum the house
4. Take the dog for a walk
```

Result:

1. Make some Bacon
2. Laundry
3. Vacuum the house
4. Take the dog for a walk

To make an unordered list you do the same thing just replace the numbers for a `-` or `+`.

```markdown
# Shopping List

- Eggs
- Milk
- Ham

* Eggs
* Milk
* Ham
```

Result:

- Eggs
- Milk
- Ham

* Eggs
* Milk
* Ham

### [Block Quotes](#block-quotes)

To add a blockquote you just need to add `>` to the front of the text.

```markdown
> this is a blockquote
```

Result:

> this is a blockquote

### [Italics, Bold, and Strikethrough](#italics-bold-and-strikethrough)

You can also make Italic's, Bold text and Strikethroughs, just like these:

```markdown
_This is italicized_

_This is italicized_

**This is bold**

**This is bold**

~~This is a strikethrough~~
```

Result:

_This is italicized_

_This is italicized_

**This is bold**

**This is bold**

~~This is a strikethrough~~

## [The cool and extra tags](#the-cool-and-extra-tags)

These tags are still very useful, but might not be as common as the above tags (depending on where you are looking).

### [Code](#code)

This one is a little different because you have to specify the start and end of the code block. For both the beginning and end of a code block you will just need to place ` ``` `. With these blocks, you can also specify the coding language. To do so just add the language title right after the first ` ``` `. A great list of how languages should be entered in for the title and a great code block color/pretifier is [prismjs.com/#supported-languages](https://prismjs.com/#supported-languages).

    ```html
    <h1>Heading 1</h1>

    <p>I am a paragraph</p>
    ```

#### [Inline Code](#inline-code)

If you want to add a code block inline with a paragraph it's as simple as adding backticks around some text like this:

```markdown
This is some text about a `<p>` tag.
```

Result:

This is some text about a `<p>` tag.

Because I am considering this article a cheat sheet for markdown I will update it if I find more features in markdown.