My Learning Blog

Markdown cheetsheet - 2/1/2024

How to learn md quickly

Markdown is a fairly easy to use markup language that lets you write simple text which can then be converted to HTML (or any other medium) with ease. It is used in many places, such as, GitHub README files, Reddit comments, and even this blog.

Markd Basics

Markdown is mainly used to style and layout text so the first things we are going to cover are the absolute basic text layouts you can do with Markdown. Also, to create a markdown file you just need to end your file with the .md extension.

Headings

Just like HTML, Markdown has six levels of headings. Headings in Markdown are created by putting one to six # in front of your heading text with a space separating the # and text.

Text Styling

Italics

These can be generated by using one * or _ wrapping your text.
This is Italics

Bold

These can be generated by using two * or _ wrapping your text.
this is Bold

Italics and Bold

This is Both

Stikethrough

To create strikethrough text you can wrap your text in two ~ characters. corssed

Highlight

To highlight text you can wrap your text in two = characters. Unfortunately, GitHub Flavored Markdown does not support this feature so it will not work in the editor below, but you can use HTML within Markdown (sometimes) so I also included the HTML version of this feature.

==sun== and sun

Superscript/Subscript

To create superscript text you can wrap your text with a ^ character and to create subscript text you can wrap your text with a ~ character. This again does not work with GitHub Flavored Markdown so I have included the HTML version of this feature.

a2 and a2

Handling Code

Inline Code

To display code inline you can wrap your code in a single ` character. This is useful for displaying small snippets of code within a paragraph.

This is inline codel like const a = 1

Code Blocks

To display a larger block of code you can wrap your code in ```. You can also specify the language of your code block by adding the language name after the three characters. This will add syntax highlighting to your code block.

// this is a code block
const a = 1;

Other Elements

To create a link you can wrap your text in square brackets and then wrap the link in parentheses.

This is my note come from

https://blog.webdevsimplified.com/2023-06/markdown-crash-course/

https://blog.webdevsimplified.com/2023-06/markdown-crash-course/

Image

Images look very similar to links since they are also wrapped in square brackets and parentheses. The only difference is that you need to add an exclamation mark before the square brackets. Also, the text in the square brackets is used as the alt text for the image while the link in the parentheses is used as the source for the image.

Blockquotes

Blockquotes are used to quote another source. To create a blockquote you can add a > character before your text. You can also nest blockquotes by adding multiple > characters.

This is a blockquote

This is a nested blockquote

Deeper nest

Horizontal Rule

To add a horizontal rule you can add three or more -, _, or * characters on a single line.

List

Unordered List

To create an unordered list you can add a -, *, or + character before each item in your list.

Ordered List

To create an ordered list you can add a number followed by a . character before each item in your list. The actual order of the numbers you use does not matter. You can also nest lists by indenting them with four spaces and/or a tab.

  1. This is an ordered list
  2. The number do not matter
  3. This says 3
    • This is a nested list
    • Of items
      • This is also nested

Checklist