Markdown syntax provides a simple way to describe the desired formatting of text documents. In fact, all of the learning modules (including this one you're reading) were written using Markdown! With only a small handful of options, Markdown allows you to format to your text (like making text bold, or italics), as well as provide structure to a document. There are a number of programs and service that support the rendering of Markdown, including GitHub, Slack, and StackOverflow (though note the syntax may vary slightly across programs). In this section, you'll learn the basics of Markdown syntax, and how to leverage it to produce readable code documents.

Contents

• Resources
• Writing Markdown
  • Text Formatting
  • Text Blocks
• Rendering Markdown
• Practice

• Original Markdown Source
• GitHub Markdown Basics
• Slack Markdown
• StackOverflow Markdown

Markdown is a lightweight markup language that is used to format and structure text. It is a kind of "code" that you write in order to annotate plain text: it lets the computer know that "this text is bold", "this text is a heading", etc. Compared to other markup languages, Markdown is easy to write and easy to read without getting in the way of the text itself. And because it's so simple to include, it's often used for formatting in web forums and services (like Wikipedia or StackOverflow).

At it's most basic, Markdown is used to declare text formatting options. You do this by adding special symbols (punctuation) around the text you wish to "mark". For example, if you wish to make text italiced, you would surround it with underscores (_) so it looks like _italicized text_. You can see how this looks in the below example (code on the left, rendered version on the right):

There are a few different ways you can format text:

But Markdown isn't just about adding bold and italics in the middle of text—it also enables you to create distinct blocks of formatted content (such as a header or a chunk of code). You do this by adding a single symbol in front of the text. Consider the below example:

As you can see, the document (right) is produced using the following Markdown shorthand:

And as you might have guessed from this document, Markdown can even make tables, create hyperlinks, and include images!

For more thorough lists of Markdown options, see the online resources linked above.

Note that Slack will allow you to use Markdown as well, though it has slightly different syntax. Luckily, the client gives you hints about what it supports:

In order to view the rendered version of your Markdown-formatted syntax, you need to use a program that converts from Markdown into a formatted document. Luckily, GitHub will automatically render your Markdown files (which end with the .md extension), and Slack or StackOverflow will automatically format your messages.

However, it can be helpful to preview your rendered Markdown before uploading code. The best way to do this is to simple write your marked code in a text-editor that supports preview rendering, such as Atom.

• To preview what your rendered content will look like, simply open a Markdown file (.md) in VS Code. Then use the command palette (or the shortcut ctrl-shift-m) to find the Markdown: Open Preview to Side. Once this preview is open, it will automatically update to reflect any changes to the text!

Other options for rendering Markdown include:

• Many editors (such as Atom) also include automatic Markdown rendering, or have extensions to provide that functionality. Atom makes it easy to Toggle Github Style and make sure the rendered preview looks the same as it will when uploaded to GitHub.

• Stand-alone programs such as Macdown (Mac only) will also do the same work, often providing nicer looking editor windows.

• There are a variety of online Markdown editors that you can use for practice or quick tests. Dillinger is one of the nicer ones, but there are plenty of others if you're looking for something more specific.

• There are also a number of Google Chrome Extensions that will render Markdown files for you. For example, Markdown Reader, provides a simple rendering of a Markdown file (note it may differ slightly from the way GitHub would render the document). Once you've installed the Extension, you can drag + drop a .md file into a blank Chrome tab to view the formatted document. Double-click to view the raw code.

For some simple practice using Markdown skills, see exercise-1 and exercise-2. Note that you can fork and clone the repo (as described in module 4) to edit the code directly, or simply create and edit new .md files in VS Code.