Markdown: The Ultimate Guide to Mastering Basics

Markdown: The Ultimate Guide to Mastering Basics

If you’ve ever written anything online, chances are you’ve come across Markdown. It’s a simple markup language that allows you to easily format and style text without having to learn complex HTML or CSS. In this blog post, we’ll go over the basics of Markdown and show you how to use it to create clean, easy-to-read text.

What is Markdown?

Markdown is a lightweight markup language that uses a simple syntax to format text. It was created by John Gruber in 2004 as a way to write in an easy-to-read and easy-to-write format that could be converted into HTML. Markdown is now widely used on websites like GitHub, Reddit, and Stack Overflow, among others.

Markdown Syntax

Mastering the syntax of Markdown is a breeze with its simple and intuitive design. Discover the power of basic elements like headers, lists, links, and more, to effortlessly enhance your content. Here are some of the basic elements you can use:

Headers

To add a header, simply put a “#” symbol at the beginning of a line of text. The more “#” symbols you use, the smaller the header will be. For example:

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

Emphasis

To make text bold, surround it with two asterisks (“*”). To italicise text, surround it with a single asterisk (“”). For example:

This is **bold** text.
This is *italic* text.

Lists

To build a bulleted list, simply put a “-“ or “*” symbol at the beginning of each line. To create a numbered list, put the number followed by a period. For example:

- Unordered List Item 1
- Unordered List Item 2
- Unordered List Item 3

1. Ordered List Item 1
2. Ordered List Item 2
3. Ordered List Item 3

Links

To create a link, put the text you want to display in square brackets, followed by the URL in parentheses. For example:

[Click here](https://www.example.com)

Images

To add an image, put an exclamation mark (“!”) before the square brackets used for a link. Inside the brackets, include the alternate text for the image (which will be displayed if the image can’t be loaded) and the URL of the image file in parentheses. For example:

![Alternate text](https://www.example.com/image.png)

Code

To format code, surround it with backticks. For example:

This is inline code.

To format a block of code, start and end the block with three backticks. You can also specify the programming language to enable syntax highlighting. For example:

function calculateSquare(number) {
  return number * number;
}

console.log(calculateSquare(5));

Horizontal Rule

To insert a horizontal rule, put three or more dashes or asterisks on a line by themselves. For example:

--- Horizontal Rule

Conclusion

Markdown is a basic but powerful text formatting tool. It’s simple to use and can be used for everything from writing blog articles to producing README files for GitHub repositories. After reading this piece, you’ll be well on your way to utilising Markdown to create clear, easy-to-read content.

Further reading

Looking to expand your knowledge of Markdown? Dive deeper with this fantastic resource – How to write in Markdown – The MDN Web Docs project | MDN

See also

How to Write a Good README.md for Beginners
Git for Beginners: Mastering the Fundamentals of Version Control
Exploring the world of Frontend Development

If you liked this article, then please share. You can also find me on Twitter for more updates.