Learn Markdown for beginner

Learn Markdown for beginner

What is Markdown?

Markdown is a lightweight markup language to add formatting elements to plaintext text documents. Markdown was designed for the web, so it should come as no surprise that there are plenty of applications specifically designed for creating website content.

Why Markdown?

  • Markdown can be used to create websites, documents, notes, books, presentations, email messages, and technical documentation.

  • Markdown is portable. Files containing Markdown-formatted text can be opened using virtually any application.

  • Markdown is platform independent. You can create Markdown-formatted text on any device running any operating system.

  • Markdown is future-proof. Even if the application you’re using stops working at some point in the future, you’ll still be able to read your Markdown-formatted text using a text editing application.

  • Markdown is everywhere. Websites like Reddit and GitHub support Markdown and lots of desktop and web-based applications support it.

Italics and Bold

  • To make a phrase italic in Markdown, you can surround words with an underscore (_) or asterisk (*). Example: _this_ would be in italic as this.

  • To make a phrase bold in markdown, you can surround the word with two asterisks(**).Example: **Bold** would become Bold.

  • To make words both italic and bold, place the asterisks and underscores as **_I am Lenin_**. It will look like I am Lenin.

Headers

There are six types of headers. To make headers in Markdown, preface the phrase with a hash mark(#). Give a space between # and the first word of the phrase.

Markdown Header
# Header 1
## Header 2
### Header 3
#### Header 4
##### Header 5
###### Header 6

Lists

Unordered List

To create an unordered list, add dashes (-), asterisks (*), or plus signs (+) in front of line items. Indent one or more items to create a nested list. Example:

- Item 1
- Item 2

It will become

  • Item 1
  • Item 2

Ordered List

To create an ordered list, add line items with numbers followed by periods. The numbers don’t have to be in numerical order, but the list should start with the number one.

Example:

  1. First item
  2. Second item
  3. Third item
    1. Indented item
    2. Indented item
  4. Fourth item

To create a link, enclose the link text in brackets (e.g., [Google]) and then follow it immediately with the URL in parentheses (e.g., (google.com)).

My favorite search engine is [Google][(https://www.google.com). The rendered output looks like this:
My favorite search engine is Google.

Adding Titles

You can optionally add a title for a link. This will appear as a tooltip when the user hovers over the link. To add a title, enclose it in quotation marks after the URL.
My favorite search engine is [Google](https://www.google.com "The best search engine for privacy").

The rendered output looks like this:
My favorite search engine is Google.

URLs and Email Addresses

To quickly turn a URL or email address into a link, enclose it in angle brackets.

<https://www.wikipedia.org>
<lenincode2018@gmail.com>

The rendered output looks like this:

https://www.wikipedia.org
lenincode2018@gmail.com

Images

To add an image, add an exclamation mark (!), followed by alt text in brackets, and the path or URL to the image asset in parentheses. You can optionally add a title in quotation marks after the path or URL.

![Ineuron](./img/ineuron.png "Ineuron"). The rendered output looks like this:

ineuron-logo.png

To add a link to an image, enclose the Markdown for the image in brackets, and then add the link in parentheses.

[Ineuron](./img/ineuron.png"Ineuron) (https://ineuron.ai/)

Blockquotes

To create a blockquote, add a > in front of a paragraph.

> Dorothy followed her through many of the beautiful rooms in her castle.
The rendered output looks like this:

Dorothy followed her through many of the beautiful rooms in her castle.

Nested Blockquotes

Blockquotes can be nested. Add a >> in front of the paragraph you want to nest.

>Lorem Ipsum is simply dummy text of the printing and typesetting industry.
>> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.

The rendered output looks like this:

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.

Code

To denote a word or phrase as code, enclose it in backticks (`).

Hello `let` is a keyword. The rendered output looks like this:
Hello let is a keyword.

Code Snippets

To show code blocks, enclose the code snippets with three backticks(```).

```javascript
if (isServer && user) {
store.userStore.currentUser = user;
}
```

The rendered output looks like this:

if (isServer && user) {
  store.userStore.currentUser = user;
}

Conclusion

Now, let's wrap things up. I believe you get the idea of how the markdown is written and get rendered. If you'd like to know more about markdown implementations, go check out the links below: