Resources

Claude Code + Marp
สร้าง Slide ด้วย AI

Marp แปลง Markdown ให้เป็น presentation — Claude Code เขียน slide ให้ทั้งหมด คุณแค่ดู preview และ export ออกเป็น PDF, PPTX, หรือ HTML

Claude Code + Marp — สร้าง Slide ด้วย AI
ดูวิดีโอ Tutorial

Marp คืออะไร?

Marp คือ open-source framework ที่เปลี่ยน Markdown ธรรมดาให้เป็น slide presentation — เขียน .md ไฟล์ได้เลย แล้ว export ออกเป็น PDF, PPTX, หรือ HTML

ทุกอย่างอยู่ใน text — version-controllable ด้วย git และที่สำคัญ LLM เขียน Markdown ได้เป็นธรรมชาติ ทำให้ Claude Code สร้าง slide ให้ได้โดยตรง

  • LLM-writableClaude Code เขียน Markdown ได้เต็มที่ — AI สร้าง slide ให้โดยตรง ไม่ต้องคลิก GUI
  • Version controlทุกอย่างเป็น text — git diff, branch, และ merge ได้เหมือน code
  • Multi-format exportExport ออก PDF, PPTX, หรือ HTML standalone จากไฟล์ Markdown เดียว
  • Consistent stylingCSS ตัวเดียวคุม design ทั้ง deck — ไม่มี slide 7 ลืมเปลี่ยนสี
  • Free & open sourceไม่มีค่า subscription ไม่ต้อง sign in ใช้ได้เต็มที่ผ่าน CLI

Workflow: Claude Code + Marp

ทำแค่ 4 ขั้นตอน — ไม่ต้องเปิด PowerPoint หรือ Keynote เลย

1

บอก Claude Code concept

อธิบายว่าต้องการ slide เกี่ยวกับอะไร กี่ slides style ไหน

2

Claude เขียน .md ให้

Claude สร้างไฟล์ Markdown พร้อม frontmatter, divider, และ layout

3

Preview แบบ live reload

รัน marp --html --preview แล้วดูผลทันที ปรับ prompt ได้เรื่อยๆ

4

Export เมื่อพร้อม

ได้ PDF, PPTX, หรือ HTML standalone จากไฟล์เดียว

Installation

ติดตั้งผ่าน npm หรือ Homebrew แล้วใช้ได้ทันทีจาก terminal

ติดตั้ง Marp CLI
# ผ่าน npm (global)
npm install -g @marp-team/marp-cli

# ผ่าน Homebrew (Mac)
brew install marp-cli

# เช็คว่าติดตั้งแล้ว
marp --version

CLI Commands

Commands ที่ใช้บ่อยที่สุด — ต้องมี --html flag ถ้า slide มี <style> หรือ SVG inline

Marp CLI Commands
# Preview แบบ live reload (ต้องมี --html ถ้า slide ใช้ <style> หรือ SVG)
marp --html --preview presentation.md

# Export เป็น PDF
marp presentation.md --pdf

# Export เป็น PowerPoint
marp presentation.md --pptx

# Export เป็น HTML standalone
marp --html presentation.md

# Watch mode — rebuild อัตโนมัติเมื่อไฟล์เปลี่ยน
marp --watch presentation.md

Syntax พื้นฐาน

บอก Claude Code structure นี้ แล้วให้มันเขียนเนื้อหาให้ตามที่ต้องการ

Marp Markdown Template
---
marp: true
theme: default
paginate: true
---

# Slide แรก

เนื้อหา slide แรก

---

# Slide ถัดไป

แค่ใช้ --- เพื่อแบ่ง slide

---

<!-- _class: lead -->

# Slide Title (centered)

![bg right:40%](./image.png)

เมื่อไรที่ไม่ควรใช้ Marp

Marp เหมาะกับ technical content และ solo workflow — มี 3 กรณีที่ควรใช้ tool อื่นแทน

ไม่เหมาะ

Pitch deck ลูกค้า

ถ้าต้องการ pixel-perfect design และ visual wow factor — ใช้ Keynote หรือ Figma แทน

ไม่เหมาะ

ทีมที่ไม่รู้ Markdown

ถ้าต้องการ real-time collab แบบ Google Slides — Marp ไม่มี collab built-in

ไม่เหมาะ

Animation-heavy

Marp ไม่มี cinematic transition เหมือน Keynote — ถ้าต้องการ animation จัดเต็ม ใช้ tool อื่น

Community

เรียนรู้ AI ไปด้วยกัน

อยากคุยกับคนที่ทดลอง AI เหมือนกัน? Community ของเรากำลังจะมา — สมัคร waitlist ไว้เลย จะได้รู้ก่อนใคร

Everyday with Captain