Markdown Guide
A tour of formatting and syntax.
This is a demonstration of various markdown features.
Text Formatting
You can make text bold or italic. You can also combine them for bold italic text.
Use inline code for short code snippets or commands.
Lists
Unordered List
- First item
- Second item
- Nested item
- Another nested item
- Third item
Ordered List
- Step one
- Step two
- Step three
Code Blocks
TypeScript
function greet(name: string) {
return `Hello, ${name}!`
}JavaScript
const fetchData = async (url) => {
const response = await fetch(url)
const data = await response.json()
return data
}Python
def calculate_sum(numbers):
total = sum(numbers)
return total
result = calculate_sum([1, 2, 3, 4, 5])
print(f"Sum: {result}")React/JSX
export default function UserCard({ user }) {
return (
<div className="card">
<h2>{user.name}</h2>
<p>{user.email}</p>
</div>
)
}CSS
.container {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background: linear-gradient(to bottom, #667eea 0%, #764ba2 100%);
}SQL
SELECT u.id, u.name, COUNT(p.id) as post_count
FROM users u
LEFT JOIN posts p ON u.id = p.user_id
WHERE u.active = true
GROUP BY u.id, u.name
ORDER BY post_count DESC;Bash
#!/bin/bash
for file in *.txt; do
echo "Processing $file"
cat "$file" | grep -i "error" >> errors.log
doneJSON
{
"name": "gistajs",
"version": "1.0.0",
"dependencies": {
"react": "^19.0.0",
"react-router": "^7.0.0"
}
}Go
package main
import "fmt"
func main() {
numbers := []int{1, 2, 3, 4, 5}
sum := 0
for _, num := range numbers {
sum += num
}
fmt.Printf("Sum: %d\n", sum)
}Links and Images
Blockquotes
This is a blockquote. It can be used for highlighting important information or quotes.
Note: You can also use formatting inside blockquotes.
- List items work too
- Another item
Tables
Basic Table
| Feature | Status | Priority |
|---|---|---|
| SSR | ✅ Complete | High |
| Forms | ✅ Complete | High |
| Auth | 🚧 In Progress | Medium |
Alignment Options
| Left Aligned | Center Aligned | Right Aligned |
|---|---|---|
| Text | Text | Text |
| 100 | 200 | 300 |
| Apple | Banana | Orange |
Complex Data Table
| Package | Version | Size | License | Downloads |
|---|---|---|---|---|
| react | 19.0.0 | 6.4 kB | MIT | 20M/week |
| react-router | 7.0.0 | 12.1 kB | MIT | 5M/week |
| drizzle-orm | 0.30.0 | 45.2 kB | Apache-2.0 | 500K/week |
| tailwindcss | 4.0.0 | 3.5 MB | MIT | 10M/week |
Comparison Table
| Feature | SQLite | PostgreSQL | MySQL |
|---|---|---|---|
| Serverless | ✅ Yes | ❌ No | ❌ No |
| ACID Compliant | ✅ Yes | ✅ Yes | ✅ Yes |
| JSON Support | ✅ Yes | ✅ Yes | ✅ Yes |
| Full-Text Search | ✅ Yes | ✅ Yes | ✅ Yes |
| Max DB Size | 281 TB | Unlimited | 64 TB |
| Learning Curve | Easy | Medium | Medium |
API Response Table
| Endpoint | Method | Auth Required | Rate Limit | Response Time |
|---|---|---|---|---|
| /api/users | GET | ❌ No | 100/min | ~50ms |
| /api/users/:id | GET | ✅ Yes | 1000/min | ~30ms |
| /api/posts | POST | ✅ Yes | 20/min | ~100ms |
| /api/search | GET | ❌ No | 50/min | ~200ms |
Task Lists
- Set up project
- Configure routing
- Add authentication
- Deploy to production
Strikethrough
This text is struck through using double tildes.
You can combine formatting: bold strikethrough or italic strikethrough.
Autolinks
URLs are automatically converted to links: https://reactrouter.com
Email addresses too: support@example.com
Horizontal Rules
You can create horizontal rules with three or more hyphens, asterisks, or underscores:
Footnotes
Here's a sentence with a footnote.1
Nested Lists with Code
- First step
const step1 = 'Initialize' - Second step
- Substep A
- Substep B
console.log('Nested code block')
- Final step
Footnotes
-
This is the footnote content. ↩