Code Blocks Markdown

Code blocks เป็นสิ่งจำเป็นสำหรับเอกสารทางเทคนิค บทแนะนำ และเนื้อหาใดๆ ที่รวมตัวอย่างโค้ด Markdown ให้หลายวิธีในการจัดรูปแบบโค้ด ตั้งแต่ inline code ง่ายๆ ไปจนถึง code blocks เต็มรูปแบบพร้อม syntax highlighting

Inline Code

สำหรับ code snippets สั้นๆ ภายในประโยค ใช้ backtick เดียว:

ใช้คำสั่ง `git status` เพื่อตรวจสอบ repository ของคุณ
ฟังก์ชั่น `console.log()` พิมพ์ไปยัง console
กด `Ctrl+C` เพื่อหยุดกระบวนการ

ผลลัพธ์:

ใช้คำสั่ง git status เพื่อตรวจสอบ repository ของคุณ ฟังก์ชั่น console.log() พิมพ์ไปยัง console กด Ctrl+C เพื่อหยุดกระบวนการ

Fenced Code Blocks

สำหรับโค้ดหลายบรรทัด ใช้ backtick สามตัว:

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

greet("World");
```

ผลลัพธ์:

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

greet("World");

Syntax Highlighting

เพิ่มชื่อภาษาหลัง backtick เปิดสำหรับ 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
```

ตัวระบุภาษายอดนิยม

ภาษา	ตัวระบุ	ทางเลือก
JavaScript	javascript	js
Python	python	py
Java	java
C++	cpp	c++
C#	csharp	cs
HTML	html
CSS	css
SQL	sql
JSON	json
XML	xml
Shell	bash	sh
TypeScript	typescript	ts
React JSX	jsx
PHP	php
Go	go
Rust	rust
Swift	swift

หมายเหตุสำคัญ

Fenced code blocks เป็นวิธีที่แนะนำสำหรับการจัดรูปแบบโค้ดใน Markdown เนื่องจากให้ syntax highlighting ที่ดีกว่าและได้รับการสนับสนุนอย่างกว้างขวางบนแพลตฟอร์มต่างๆ

แนวทางปฏิบัติที่ดี

1. ใช้ Syntax Highlighting เสมอ

❌ ไม่มี syntax highlighting:

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

✅ มี syntax highlighting:

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

2. เก็บตัวอย่างโค้ดให้มุ่งเน้น

❌ โค้ดที่ไม่เกี่ยวข้องมากเกินไป:

```javascript
// โค้ด setup มากมาย...
const express = require('express');
const app = express();
const PORT = 3000;

// ... setup เพิ่มเติม ...

// ตัวอย่างที่แท้จริง (ฝังอยู่ใน setup)
app.get('/api/users', (req, res) => {
  res.json({ users: [] });
});

// ... boilerplate เพิ่มเติม ...
```

✅ มุ่งเน้นที่ส่วนสำคัญ:

```javascript
// สร้าง API endpoint ง่ายๆ
app.get('/api/users', (req, res) => {
  res.json({ users: [] });
});
```

กรณีการใช้งานทั่วไป

เอกสาร API

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"
}

ไฟล์การตั้งค่า

สร้างไฟล์ .env ใน root ของโครงการ:

# การตั้งค่าฐานข้อมูล
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

การแก้ไขปัญหา

ปัญหาที่พบบ่อย

1. โค้ดไม่จัดรูปแบบ: ตรวจสอบ backtick ที่ถูกต้อง
2. Syntax highlighting ไม่ทำงาน: ตรวจสอบตัวระบุภาษา
3. โค้ดทำลายเค้าโครง: ใช้การขึ้นบรรทัดใหม่ที่เหมาะสม

การ Escape Backticks

หากคุณต้องการแสดง backticks ในโค้ดของคุณ:

ตัวอย่าง backtick เดียว:

• •
  เขียน: `code`
• •
  ผลลัพธ์: code

ตัวอย่าง backtick สามตัว:

• •
  เขียน: ```code block```
• •
  ผลลัพธ์: code block

Backticks ใน inline code:

• •
  เขียน: ``backtick``
• •
  ผลลัพธ์: backtick

Code blocks เป็นสิ่งจำเป็นสำหรับเอกสารทางเทคนิค ใช้เพื่อทำให้ตัวอย่างโค้ดของคุณชัดเจน อ่านง่าย และจัดรูปแบบอย่างเหมาะสม!

สุดท้าย มาเรียนรู้เกี่ยวกับ การขึ้นบรรทัดใหม่ เพื่อทำให้การจัดรูปแบบข้อความของคุณสมบูรณ์แบบ