Markdown Code Blocks

Code blocks are essential for technical documentation, tutorials, and any content that includes code examples. Markdown provides several ways to format code, from simple inline code to full code blocks with syntax highlighting.

Inline Code

For short code snippets within sentences, use single backticks:

Use the `git status` command to check your repository.
The `console.log()` function prints to the console.
Press `Ctrl+C` to stop the process.

Result:

Use the git status command to check your repository. The console.log() function prints to the console. Press Ctrl+C to stop the process.

Fenced Code Blocks

For multi-line code, use triple backticks:

```
function greet(name) {
console.log("Hello, " + name + "!");
}

greet("World");
```

Result:

function greet(name) {
console.log("Hello, " + name + "!");
}

greet("World");

Syntax Highlighting

Add the language name after the opening backticks for syntax highlighting:

JavaScript

```javascript
function calculateSum(a, b) {
return a + b;
}

const result = calculateSum(5, 3);
console.log(result); // Output: 8
```

Python

```python
def calculate_sum(a, b):
return a + b

result = calculate_sum(5, 3)
print(result) # Output: 8
```

Popular Language Identifiers

LanguageIdentifierAlternative
JavaScriptjavascriptjs
Pythonpythonpy
Javajava
C++cppc++
C#csharpcs
HTMLhtml
CSScss
SQLsql
JSONjson
XMLxml
Shellbashsh
TypeScripttypescriptts
React JSXjsx
PHPphp
Gogo
Rustrust
Swiftswift

Important Notes

Fenced code blocks are the preferred method for formatting code in Markdown as they provide better syntax highlighting and are more widely supported across different platforms.

Best Practices

1. Always Use Syntax Highlighting

❌ No syntax highlighting:

```
if (user.isLoggedIn) {
showDashboard();
} else {
showLoginForm();
}
```

✅ With syntax highlighting:

```javascript
if (user.isLoggedIn) {
showDashboard();
} else {
showLoginForm();
}
```

2. Keep Code Examples Focused

❌ Too much irrelevant code:

```javascript
// Lots of setup code...
const express = require('express');
const app = express();
const PORT = 3000;

// ... more setup ...

// The actual example (buried in setup)
app.get('/api/users', (req, res) => {
res.json({ users: [] });
});

// ... more boilerplate ...
```

✅ Focused on the important part:

```javascript
// Create a simple API endpoint
app.get('/api/users', (req, res) => {
res.json({ users: [] });
});
```

Common Use Cases

API Documentation

Request:

POST /api/users
Content-Type: application/json

{
"name": "John Doe",
"email": "[email protected]"
}

Response:

{
"id": 123,
"name": "John Doe",
"email": "[email protected]",
"created_at": "2024-01-15T10:30:00Z"
}

Configuration Files

Create a .env file in your project root:
# Database configuration
DB_HOST=localhost
DB_PORT=5432
DB_NAME=myapp
DB_USER=postgres
DB_PASSWORD=password123

# API Keys
API_KEY=your_api_key_here
SECRET_KEY=your_secret_key_here

Troubleshooting

Common Issues

  1. Code not formatting: Check for proper backticks
  2. Syntax highlighting not working: Verify language identifier
  3. Code breaking layout: Use proper line breaks

Escaping Backticks

If you need to show backticks in your code:

Single backtick example:

  • Write: `code`
  • Result: code
Triple backticks example:

  • Write: ```code block```
  • Result: code block
Backticks in inline code:

  • Write: ``backtick``
  • Result: backtick
Code blocks are essential for technical documentation. Use them to make your code examples clear, readable, and properly formatted!

Finally, let's learn about line breaks to perfect your text formatting.