# Markdown

August 17th, 2021

# Markdown

## Poll

How many have used something like Markdown, ReStructured Test (RST), …

## What is it?

It’s a plain text format for writing structured documents, based on formatting conventions from email and usenet.

## My Take

Using raw HTML can be quite tedious for everyday types of writing or code documentation. In addition, taking the time to insert HTML tags can make the already painful task of writing even more horrible.

This is why I use markdown to generate the bulk of my HTML content, but not HTML GUIs.

## Who Uses It?

From Wikipedia

Sites such as GitHub, Bitbucket, Reddit, Diaspora, Stack Exchange, OpenStreetMap, and SourceForge use variants of Markdown to facilitate discussion between users.

## More Uses

Markdown is very popular with static site generators. From the Wintersmith home page:

No more fiddling around with WYSIWYG editors. Once you start using Markdown to author your content you’ll never look back! Wintersmith’s markdown plugin allows you to use markdown as backing for all your sites content, not just blog posts.

## GitHub and Markdown

• GitHub renders the README.MD Markdown file for your repository.
• This is how you will “submit” the write ups to your assignments.

## How to Practice

A number of choices

## Text Formatting

• For italic surround with *, i.e., *CS351*, yields: CS351

• For bold surround with **, i.e., **CS351**, yields CS351

• Bold and italic? How about ***CS351***, yields CS351

You start a line with a # for an <h1>,

You start a line with ## for an <h2>,

Etc…

## Lists

• Bullet lists start with * followed by a space.

• Numbered lists start with a 1. followed by a space.

## Paragraphs and Block Quotes

• A new paragraph is started by skipping a line

• A block quote is started with a > at the beginning of a line.

## Code 1

• Inline code uses “backticks” a = 3; gives a=3;
• For a block of code with syntax highlighting use
    html
<p>Some HTML code <span>highlighted</span></p>
<p>Another Paragraph</p>


## Code 2

Syntax Highlighted Code

<p>Some HTML code <span>highlighted</span></p>
<p>Another Paragraph</p>

## Practice Question

If time permits we’ll do a practice question together!

## What if I need more structure?

• I want to use <section>, <aside>, <article> and other nice HTML5 elements.

• The CommonMark specification allows you to put HTML blocks into your markdown document and have them interpreted as HTML!

• This is how I add structure to the homework and other files.

## Embedded HTML

<link href="hw2.css" rel="stylesheet">
<main>
This week's questions are concerned with JavaScript and the DOM.