Resources

Starter code for this video:

# Markdown Basics
## Headlines, Paragraphs, and Basic Formatting
### Headlines
Type a single hash (AKA pound symbol) and a space to create the largest or first-level heading. A second-level heading uses two hashes next to each other followed by a space and text. The rest of the headline levels just add another hash.
#### Heading Level 4
##### Heading Level 5
###### Heading Level 6
### Paragraphs and Line Breaks
We create paragraphs by typing the way we would in any other program. Just hit return twice to start another paragraph.
Where you see empty space between blocks of text in your Markdown document, you will see empty space separating those blocks of text in your formatted HTML document.
#### Line Breaks
You don’t always want that space that appears between one line of text and another: for example, lines of poetry or song lyrics don't have spaces between them. To add just a line break without a space, type two spaces at the end of a line, then press return once.
I love you without knowing how, or when, or
from where
I love you directly without problems or pride:
I love you like this because I don't know any
other way to love
Neruda, Pablo. "Sonnet 17" The Poetry of Pablo Neruda, edited by Ilan Stavans, translated by Mark Eisner, Farrar, Straus and Giroux, 2005, p. 514.
### Emphasis and Bolding
#### Italics
Emphasis can be added with either the asterisk or the underscore characters.
This *works*, and this _works_ too
#### Bolding
Bolding is easy too. Just add an extra asterisk or underscore.
This **works**, and this __works__ too
#### Bolding and Emphasis Together
You can even bold and italicize text like ***this*** or ___this___
### Blockquotes
A blockquote sets text apart from the rest of the document. It indicates that the text is quoted from another source.
You format a blockquote using the greater than symbol. If you want a blockquote to span multiple paragraphs, add the greater than symbol to the line between paragraphs too.
> Markdown is intended to be as easy-to-read and easy-to-write as is feasible.
>
> Readability, however, is emphasized above all else. A Markdown-formatted document should be publishable as-is, as plain text, without looking like it’s been marked up with tags or formatting instructions. — John Gruber
### Horizontal Rule
OK, that’s a good start. We can separate this from our next section with a horizontal rule, which is just a line used to separate sections of a document.
You can use three or more underscores, asterisks, or hyphens. I prefer hyphens.
___
***
---
## Lists
You can write both numbered and bulleted lists with Markdown.
### Numbered Lists
You create numbered lists like you do in other writing programs. Type the number, a period, a space, and the item label.
1. Item One
2. Item Two
To nest an item, indent it with a tab or at least two spaces beneath the item above it.
1. Item One
1. Nested Level Two
2. Nested Level Two
1. Nested Level Three
2. Nested Level Three
#### Bulleted Lists
Bulleted lists work like numbered lists, but you use the asterisk character, a space, and no period.
* Item One
* Item Two
You can nest bulleted items too. We just indent our item below another item like we did with our numbered list.
* Item One
* Nested Item One
* Nested Item Two
##### Asterisk Gotchas
Because the asterisk is used for bolding, italicizing, and creating bulleted lists, it's easy to make mistakes. Check your spacing, and use a preview to ensure you are formatting text the way you intend.
*Italicized Item*
*Not Formatted
* Bulleted Item
What if you do want a bulleted item that is bold and italicized? Type an asterisk and a space. This will create the bulleted item. Then use two asterisks for the bolding and a third for the italicizing on both sides of the text.
* ***Bold Italicized Bulleted Item***
#### Mixed Lists
You can mix the two list styles too. Just use the numbers or asterisks where you want them.
1. Item One
* Nested Item
* Nested Item
2. Item Two
* Nested Item
* Nested Item
1. Deep Nested Item One
2. Deep Nested Item Two
* Super Deep Nested Item
* Super Deep Nested Item
---
## Code
We format code using the backtick character. The backtick is on the same key as the tilde on a U.S. English keyboard, which is usually to the left of the number 1 and above the tab key.
You can use a single backtick to create inline code. For example, you may type something like this:
To install the latest version of NPM, you can type, `npm install npm@latest -g`
For multiple lines of code, you'll usually create a code block. Instead of one backtick, use three backticks above and below the code block. Some sites and editors also support syntax highlighting by language. Add it by typing the name of the coding language immediately after the top three backticks.
```JavaScript
let exampleFunction = () => {
let foo = 'foo';
let bar = 'bar';
return foo + bar;
}

0:00

When writing documents for the web, it is
pretty hard to avoid links to other sites,

0:04

other pages, or
even spots within the same page.

0:07

Markdown provides a syntax for
writing links that is easy to remember and

0:11

feels natural.

0:12

Let's add a heading for this section.

0:16

Now to add a link,

0:18

you would first type what you want to
appear on the page inside square brackets.

0:22

Then immediately following
those square brackets,

0:24

you would add the link
URL inside parenthesis.

0:28

So for example if I wanna link to
Treehouse, I would type square brackets

0:32

and then I want word Treehouse to appear
on the page, so that's what I type inside.

0:37

Then immediately following this closing
square bracket, I'll type parenthesis and

0:43

the URL that I wanna link to
inside those parentheses.

0:46

In this case, that'll be
teamtreehouse.com and that's it.

0:52

This simplicity allows me to
focus on my writing rather

0:55

than on how to link to something.

0:57

If we scroll down in the preview, you can
see that we have a link to treehouse.

1:01

If I click it,
It'll take me to the page, perfect.

1:07

You also have the option
to provide a title,

1:09

which appears when you hover
the mouse cursor over the link.

1:12

You just type a space after the URL and
close the title inside quotes.

1:17

Both the url and
the title should be inside parentheses.

1:20

So let's create another link to Treehouse.

1:23

So that you can see
what I'm talking about.

1:26

So Treehouse quotes, the URL,
so nothing is changed so far.

1:36

Now, after the URL,
I'll type the space and

1:39

then I want to remain inside
this closing parenthesis and

1:44

then I'll type my quotes and the title.

1:52

Now if I scroll down in the preview and
hover over the first link,

1:56

you can tell it's a link,
but nothing else happens.

2:00

If I scroll over the second link, we see
our title up here link to Treehouse.

2:05

If I click on it it'll
still take me to Treehouse.

2:08

Let's come back to our document.

2:12

Now what if I want to link to a reference
at the bottom of a section or

2:16

a page like a footnote?

2:18

You start with the text
in square brackets, but

2:20

you don't add the parenthesis.

2:22

Instead, you add a number to reference
in another set of square brackets.

2:26

So I would start with square brackets and
let's link to treehouse again,

2:31

so I'll call this treehouse and
then outside the square brackets,

2:36

another set of square brackets and
then a number to reference.

2:39

Because this is the first reference
link we've used in this document,

2:43

I'll type the number one.

2:43

And now, at another place in the document,

2:48

I would type square brackets and
the number that I'm trying to reference.

2:54

In this case it would be one and
then I would type a colon

3:01

immediately outside my closing bracket,
a space and the URL that I wanna link to.

3:07

And again this is just going
to be the treehouse URL.

3:15

Now you may have noticed there
are no parentheses here.

3:18

A reference link does not require
parenthesis but it still works.

3:24

However just so you don't feel limited
we can add a title to a reference link.

3:28

You would type a space and again we're
not gonna add parenthesis anywhere.

3:32

But we will add the quotes and our title.

3:40

Now if we scroll down in our preview,
we have all three links.

3:46

And you can see link to Treehouse,
reference link to Treehouse.

3:51

If we click on it, same behavior.

3:56

Remembering how to write a link in
Markdown can be a little tough at first,

4:00

but after you've written a few links,
it'll feel natural.

4:03

Even if it doesn't, you'll have this handy
Markdown reference document to remind you.

4:08

WIth our new linking power let's
go up to our block quote and

4:10

make John Gruber's name
a link to his website.

4:13

I think that would be nice.

4:14

Then we can call this video a wrap.

4:16

So let's go find that block quote
Of our list section, there we go.

4:25

Now I want John Gruber's name to
continue appearing on the page.

4:27

I want it to be clickable, so
of course that goes on square brackets.

4:35

And then a URL to his websites,
inside parenthesis.

4:40

I happen to have a linked to his page on
Markdown, so I'll paste that in here.