I am Hack Sparrow
Captain of the Internets.

Markdown Tutorial

A quick tutorial on Markdown

Curious about Markdown? Wondering what its uses are? How vast and difficult it might be to learn it?

Worry not, for the Captain of the Internets is here to guide you through the sea of Markdown toughness. Everyone aboard the Markdown tutorial ship!

Markdown is a simplified text formatting language. It is like HTML, you use combination of weird characters to format text - only much simpler, and more friendly to humans. Markdown is frequently used for generating HTML, so learning Markdown from HTML point of view is the best way to learn Markdown. I hope you atleast the basics of HTML, else go learn it somewhere.

As a convention, Markdown files are saved with a .md extension.

Here are some examples of the Markdown syntax.

Line breaks and Paragraphs

Markdown:

Line number one  
Line number two

Para number two

HTML:

<p>
Line number one<br>
Line number two
</p>
<p>
Para number two
</p>

Note: The standard Markdown syntax for a line break is to end a line with two spaces. However, GitHub's Markdown implementation seems not to require so.

Headings

Markdown:

One way of doing H1
========================
# Another way of doing H1
Here is an underlined H2
------------------------
## Here is a selected H2 ##
###This is an H3###
####It can go upto H6
##### Closing hashes are optional

HTML:

<h1>One way of doing H1</h1>
<h1>Another way of doing H1</h1>
<h2>Here is an underlined H2</h2>
<h2>Here is a selected H2</h2>
<h3>This is an H3</h3>
<h4>It can go upto H6</h4>
<h5>Closing hashes are optional</h5>

Lists

Markdown:

An ordered list of stuff to learn

1. Muay Thai
2. Drums
3. Spanish

An unordered list of books to read

- The Selfish Gene
- Phantoms in the Brain
- The God Delusion

A list of movies to watch

+ The God, The Bad, and the Ugly
+ Dirty Harry
+ Nacho Libre

A list of things to do

* Go fishing
* Go hunting
* Go swimming

HTML:

<p>An ordered list of stuff to learn</p>

<ol>
<li>Muay Thai</li>
<li>Drums</li>
<li>Spanish</li>
</ol>

<p>An unordered list of books to read</p>

<ul>
<li>The Selfish Gene</li>
<li>Phantoms in the Brain</li>
<li>The God Delusion</li>
</ul>

<p>A list of movies to watch</p>

<ul>
<li>The God, The Bad, and the Ugly</li>
<li>Dirty Harry</li>
<li>Nacho Libre</li>
</ul>

<p>A list of things to do</p>

<ul>
<li>Go fishing</li>
<li>Go hunting</li>
<li>Go swimming</li>
</ul>

You can use either *, -, or + for unordered lists.

Text styles

Markdown:

*Italics text*
**Bold text**
_This is also in italics_
__This is also bold__

HTML:

<em>Italics text</em><br>
<strong>Bold text</strong><br>
<em>This is also in italics</em><br>
<strong>This is also bold</strong>

You can use either * or _ to italicize a body of text, and ** or __ to make it bold.

Code

Markdown:

This is inline `code` right here.

And this is a function:

function main() {
return 42;
}

HTML:

<p>This is inline <code>code</code> right here.</p>

<p>And this is a function:</p>

<pre><code>function main() {
return 42;
}
</code></pre>

` for inline code. Four our more spaces for block code.

Links

Markdown:

[www.hacksparrow.com](http://www.hacksparrow.com)
[Hack Sparrow](http://www.hacksparrow.com "Captain of the Internets")

HTML:

<p><a href="http://www.hacksparrow.com">www.hacksparrow.com</a><br>
<a href="http://www.hacksparrow.com" title="Captain of the Internets">Hack Sparrow</a></p>

Horizontal Lines

Markdown:

Don't confuse with this H2
--------------------------

----

Another line goes below
***

This would create a line too
* * * *

So would this

- - - - - -

HTML:

<h2>Don't confuse with this H2</h2>

<hr>

<p>Another line goes below</p>

<hr>

<p>This would create a line too</p>

<hr>

<p>So would this</p>

<hr>

Blockquote

Markdown:

This is what you sent me in the last mail:

> you are the most amazing expert on Markdown
> so I wanna learn some Markdown Fu from you, Captain Hack Sparrow!

Savvy?

HTML:

<p>This is what you sent me in the last mail:</p>

<blockquote>
<p>you are the most amazing expert on Markdown<br>so I wanna learn some Markdown Fu from you, Captain Hack Sparrow!</p>
</blockquote>

<p>Savvy?</p>

And that's all about Markdown. Not too vast, not too difficult, but very useful and easy on the human eyes. Lots of software systems use Markdown, so it is always a bonus to know it.

This brings us to the end of the tutorial. Now that you have become a Markdown expert, test your skillz here. If you are a GitHub user, GitHub uses its own flavor of Markdown, which is built on top of the standard Markdown, you can try it out live here.

2 Responses to “Markdown Tutorial”

  1. blawbair says:

    Really good roundup of simple markdown! Just one little thing, the br-tag (line breaks) is only outputted when you end the line with two spaces. At least according to Daring Fireball’s guide which to my knowledge is the norm.

    Source: http://daringfireball.net/projects/markdown/syntax#p

  2. Captain says:

    @blawbair, thanks for pointing that out.

Make a Comment