Markdown Basics - Beginner's Guide

Markdown is a lightweight markup language that allows you to format text using simple, intuitive syntax. It's perfect for writing documentation, README files, blog posts, and more. This guide will teach you the fundamentals of markdown in just a few minutes.

What is Markdown?

Markdown is a text-to-HTML conversion tool that lets you write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid HTML. Created by John Gruber in 2004, markdown has become the standard for writing documentation and formatted text on the web.

Why Learn Markdown?

Markdown is everywhere in the modern web development and writing world:

Basic Markdown Syntax

1. Headers

Headers create document structure. Use # symbols to create different header levels:

Markdown:

# Heading 1 (Largest)
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6 (Smallest)

💡 Tip:

Always put a space after the # symbol. #Header won't work, but # Header will.

2. Text Formatting

Make text bold, italic, or strikethrough:

Markdown:

**bold text** or __bold text__
*italic text* or _italic text_
***bold and italic*** or ___bold and italic___
~~strikethrough text~~

3. Lists

Create ordered and unordered lists:

Unordered Lists:

- Item one
- Item two
- Item three

* Alternative bullet
* Another item

+ Another option
+ Final item

Ordered Lists:

1. First item
2. Second item
3. Third item

Nested Lists:

- Main item
  - Sub-item one
  - Sub-item two
- Another main item
  1. Numbered sub-item
  2. Another numbered sub-item

4. Links

Create links to websites and other resources:

Inline Links:

[Link text](https://example.com)
[Link with title](https://example.com "Title text")

Reference Links:

[Link text][reference]
[Another link][ref2]

[reference]: https://example.com
[ref2]: https://example.com "Optional title"

5. Images

Add images similar to links, but with an exclamation mark:

Markdown:

![Alt text](image-url.png)
![Alt text](image-url.png "Image title")

6. Code

Display code inline or in blocks:

Inline Code:

Use `backticks` for inline code.

Code Blocks:

```
function example() {
    return "Hello, World!";
}
```

Syntax Highlighting:

```javascript
function example() {
    return "Hello, World!";
}
```

7. Blockquotes

Quote text using the > symbol:

Markdown:

> This is a blockquote.
> It can span multiple lines.
>
> You can have multiple paragraphs.

8. Horizontal Rules

Create visual separators:

Markdown:

---
***
___

9. Tables

Create tables using pipes and dashes:

Markdown:

| Column 1 | Column 2 | Column 3 |
|----------|:--------:|---------:|
| Left     | Center  | Right   |
| Data     | Data    | Data    |

💡 Tip:

The colons (:) in the separator row control alignment: left (default), center (:---:), or right (---:).

10. Line Breaks

Control line breaks in your text:

Markdown:

Line one
Line two (single line break)

Line three (double line break creates paragraph)

💡 Tip:

Two spaces at the end of a line create a hard line break. A blank line creates a new paragraph.

Common Use Cases

README Files

README files are the perfect place to start using markdown. They're used on GitHub, GitLab, and other platforms to document projects:

Example README:

# My Awesome Project

## Description
This is a brief description of my project.

## Installation
1. Clone the repository
2. Install dependencies
3. Run the application

## Usage
```bash
npm start
```

## Contributing
Contributions are welcome! Please read the [contributing guide](CONTRIBUTING.md).

Documentation

Markdown is perfect for writing technical documentation:

Blog Posts

Many blogging platforms support markdown, making it easy to write formatted posts without HTML knowledge.

Getting Started

Ready to start writing markdown? Here's how:

  1. Use our editor - Try our Markdown Live Editor to practice
  2. Start simple - Begin with headers and basic formatting
  3. Practice regularly - Write README files or documentation
  4. Use a cheat sheet - Keep our cheat sheet handy
  5. Convert to HTML - Use our Markdown to HTML converter to see results

Next Steps

Now that you understand the basics, explore our other guides: