MARKDOWN PREVIEW FROM MOU.

Markdown for Dummies.

30 minutes guide to a lightweight markup language.

Taylor Xu
3 min readAug 11, 2013

--

Markdown is a lightweight markup language, originally created by John Gruber with substantial contributions from Aaron Swartz, allowing people “to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid XHTML (or HTML)”. The language takes many cues from existing conventions for marking up plain text in email. Markdown formatted text should be readable as-is, without looking like it’s been marked up with tags or formatting instructions,unlike text which has been formatted with a Markup language, such as HTML, which has obvious tags and formatting instructions. Markdown is a formatting syntax for text that can be read by humans and can be easily converted to HTML.

Many of my friends now use Markdown for writing and editing text, Markdown is a super simple way to format plain text. Now my goal is adapting the name “For Dummies”, creating a 30-minute tutorial for everyone who wish to use Markdown in the very near future.

First of all, editors you could use that suit all your needs:

  • Windows: MarkdownPad
  • Linux: ReText
  • Mac: Mou

Let’s get started.

  • Headers
# H1
## H2
### H3
#### H4
##### H5
###### H6
Alternatively, for H1 and H2, an underline-ish style:Alt-H1
======
Alt-H2
———
  • Lists
1. First ordered list item
2. Another item
* Unordered sub-list.
1. Actual numbers don’t matter, just that it’s a number
1. Ordered sub-list
4. And another item.
Some text that should be aligned with the above item.* Unordered list can use asterisks
- Or minuses
+ Or pluses
  • Links
[Link](https://www.google.com)[Reference-style link][Arbitrary case-insensitive reference text][Relative reference to a repository file](../blob/master/LICENSE)[Numbers for reference-style link definitions][1]Or leave it empty and use the [link text itself][]Some text to show that the reference links can follow later.
  • Images
Inline-style: 
![alt text](https://d233eq3e3p3cv0.cloudfront.net/fit/c/256/256/0*njGaeIRG6IiQJqNX.jpeg “Logo Title Text 1")
Reference-style:
![alt text][logo]
[logo]: https://d233eq3e3p3cv0.cloudfront.net/fit/c/256/256/0*njGaeIRG6IiQJqNX.jpeg “Logo Title Text 2"
  • Code and Syntax Highlighting

Blocks of code are either fenced by lines with three back-ticks ```, or are indented with four spaces. I recommend only using the fenced code blocks — they’re easier and only they support syntax highlighting.

 ```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 <b>tag</b>.
```
var s = “JavaScript syntax highlighting”;
alert(s);
s = “Python syntax highlighting”
print s
No language indicated, so no syntax highlighting in Markdown Here (varies on Github).
But let’s throw in a tag.
  • Tables
Colons can be used to align columns.| Tables | Are | Cool |
| ——————- |:——————-:| ——-:|
| col 3 is | right-aligned | $1600 |
| col 2 is | centered | $12 |
| zebra stripes | are neat | $1 |
The outer pipes (|) are optional.Markdown | Simple | Neat
—- | —- | —-
*Always* | `fast` | **typing**
1 | 2 | 3
  • Hightlights, Blockquotes, Italic and others
> Blockquotes
**Hightlights**
*Italic*
  • Horizontal Rule
Three or more…—-Hyphens***Asterisks___Underscores

Play around, and have fun! :)

--

--

Taylor Xu

Data scientist by training, software engineer by profession. I like data, film photography and abstract art. And would like to understand how human mind works.