Markdown Previewer

Markdown Previewer คืออะไร และทำไมนักพัฒนาต้องรู้จัก Markdown

Markdown คือภาษา markup แบบ plain text ที่ออกแบบมาให้เขียนง่าย อ่านง่าย และ render เป็น HTML ได้สวยงาม ถูกสร้างโดย John Gruber ในปี 2004 และปัจจุบันกลายเป็น format มาตรฐานในแวดวงนักพัฒนาซอฟต์แวร์ทั่วโลก เครื่องมือนี้ช่วยให้คุณเขียน Markdown ฝั่งซ้ายและเห็น Preview แบบ real-time ฝั่งขวาทันที

แพลตฟอร์มที่ใช้ Markdown กันอย่างแพร่หลาย ได้แก่ GitHub สำหรับ README และ Pull Request, Notion สำหรับบันทึกและ documentation, Obsidian สำหรับ personal knowledge base, Stack Overflow สำหรับตอบคำถาม, Reddit สำหรับ post และ comment, รวมถึง static site generator อย่าง Jekyll, Hugo และ Docusaurus

Markdown Syntax พื้นฐานที่ต้องรู้

ตารางสรุป syntax ที่ใช้งานบ่อยที่สุด:

• # หัวข้อ → H1 (ใหญ่สุด), ## หัวข้อ → H2, ### หัวข้อ → H3
• **ข้อความ** หรือ __ข้อความ__ → ตัวหนา
• *ข้อความ* หรือ _ข้อความ_ → ตัวเอียง
• [ลิงก์](https://example.com) → Hyperlink คลิกได้
• ![alt text](url รูปภาพ) → แทรกรูปภาพ
• - รายการ หรือ * รายการ → Bullet list
• 1. รายการ → Numbered list
• `inline code` → โค้ดแบบ inline
• ```python ... ``` → Code block พร้อม syntax highlighting
• > ข้อความ → Blockquote
• --- → เส้นแบ่ง Horizontal Rule

ตัวอย่าง Markdown จริงสำหรับ README โปรเจกต์

# ชื่อโปรเจกต์

คำอธิบายสั้นๆ ว่าโปรเจกต์ทำอะไร

## การติดตั้ง

```bash
npm install my-package
```

## วิธีใช้งาน

```javascript
const myLib = require('my-package');
myLib.doSomething();
```

## Features

- รองรับ TypeScript
- ทำงานบน Node.js 18+
- มี test coverage 90%

## License

MIT

GitHub Flavored Markdown (GFM) — ฟีเจอร์พิเศษที่ GitHub รองรับ

GitHub ขยาย Markdown มาตรฐานด้วยฟีเจอร์เพิ่มเติม:

• Task list: - [ ] ยังไม่เสร็จ และ - [x] เสร็จแล้ว → แสดงเป็น checkbox
• Table: สร้างตารางด้วย | และ ---
• Strikethrough: ~~ข้อความ~~ → ข้อความ
• Syntax highlighting: ระบุภาษาหลัง backtick เช่น ```python, ```javascript
• Autolink: URL จะถูก link โดยอัตโนมัติโดยไม่ต้องใส่ bracket

ตัวอย่างตาราง GFM:

| ฟีเจอร์       | Free Plan | Pro Plan |
|---------------|-----------|----------|
| Storage       | 5 GB      | 100 GB   |
| API calls/day | 1,000     | 50,000   |
| Support       | Community | Priority |

เคล็ดลับใช้ Markdown ให้มีประสิทธิภาพ

• ใช้ VS Code Extension "Markdown All in One" สำหรับ shortcuts และ preview ในตัว editor
• สำหรับ GitHub README ควรใส่ badge จาก shields.io เพื่อแสดง build status, coverage และ version
• Notion รองรับ Markdown แบบ inline ได้เลย เพียงพิมพ์ # ขึ้นต้นบรรทัดแล้ว Enter
• ใน Obsidian ใช้ [[page name]] สำหรับ internal link ระหว่าง note (wiki-style links)
• ระวัง trailing space — บางระบบจะตีความ 2 ช่องว่างท้ายบรรทัดเป็น line break

เครื่องมือการเงินที่น่าสนใจ