LINE Developer Tools Builde

โดย Thepnatee Phojan — LINE API Expert คอร์ส workshop ภาษาไทยสำหรับนักพัฒนาที่อยากสร้างจริงบน LINE Platform — ตั้งแต่เปิด Official Account ครั้งแรก ไปจนถึง LINE MINI App และ Dev Tools Builder ของตัวเอง

45 บทสอน เน้นเข้าใจ "ทำไม" ก่อน "ทำอะไร" — ทุกบทมีตัวอย่างใช้จริง, ภาพ Mermaid, ข้อผิดพลาดที่คนไทยมักเจอ และ Checklist ก่อนไปต่อ

---

แนะนำลำดับ

• มือใหม่ — อ่านตามลำดับ Chapter 01 → 11
• ทำ Bot อยู่แล้ว อยากต่อยอด — ข้ามไป Chapter 05 (advanced messaging) → 09 (LIFF)
• Reference จุดเดียว — ใช้ skills/ เป็น cookbook สำหรับให้ Claude/AI generate code ที่ production-ready

---

โครงสร้าง Repository

developer-tools-builder-document/
├── workshop/   ← 45 บทสอน (.md) — เอกสารหลัก
├── skills/     ← Cookbook ของขวัญนักเรียน — เอาไปใช้กับ Claude/AI ได้เลย
├── docs/       ← Reference docs จาก LINE Developers (ทางการ)
├── assets/     ← รูปภาพประกอบ

---

สารบัญ

Chapter 01 — Introduction & Overview

รู้จัก LINE OA, บริการสำหรับนักพัฒนา, URL Scheme, การเช็ค status, และ Certified Provider

	บท	หัวข้อ
01-01	LINE Official Account Overview	LINE OA แต่ละแบบ + ราคา + ฟีเจอร์
01-02	LINE Developer Services	เลือกบริการให้ถูกงาน — Messaging API / LIFF / Login / Pay
01-03	LINE URL Scheme	เปิดฟีเจอร์ใน LINE จากเว็บภายนอก
01-04	LINE API Status	เช็ค LINE ล่มหรือเปล่าก่อน debug
01-05	Certified Provider	ขอ Special API + Certified Badge

Chapter 02 — Account & API Setup

	บท	หัวข้อ
02-01	เปิด LINE Official Account	สร้าง OA + Provider + Channel
02-02	LINE Messaging API	ภาพรวม Messaging API + Webhook

Chapter 03 — Webhook

	บท	หัวข้อ
03-01	LINE Webhook Events	event types ครบ + payload + redelivery

Chapter 04 — Chatbot Development Setup

	บท	หัวข้อ
04-01	Create Chatbot ด้วย Firebase	Firebase Functions + LINE handshake
04-02	Setup Webhook	ผูก URL กับ LINE Console
04-03	Setup Webhook ผ่าน API	สำหรับ CI/CD pipeline
04-04	Webhook SSL/TLS	TLS 1.2/1.3 cert validation

Chapter 05 — Messages & Advanced Features

	บท	หัวข้อ
05-01	Message Types	text/image/video/sticker/location ฯลฯ
05-02	Postman Collection	ยิง LINE API ได้ใน 1 นาที
05-03	Quick Reply	ปุ่มตอบแบบแตะแทนพิมพ์
05-04	Quote Tokens	ตอบแบบ "อ้างอิง" ข้อความเก่า
05-05	Channel Access Token	Token ทั้ง 4 ประเภท + การ rotate
05-06	Loading Animation	บอกผู้ใช้ว่า "บอทกำลังคิด"
05-07	Message Mention (Text v2)	แท็ก @user ในกรุ๊ป
05-08	Validate Message Object	ตรวจโครงสร้างก่อนส่ง
05-09	X-Line-Signature	ตรวจลายเซ็น webhook
05-10	Sending Message	Reply / Push / Multicast / Broadcast
05-11	Narrowcast	ส่งเจาะกลุ่มแบบแม่นยำ
05-12	Message Statistics	วัดผลทุกข้อความที่ส่งออก
05-13	LINE Beacon	ส่งข้อความเมื่อผู้ใช้เดินผ่าน
05-14	API Error Codes	อ่าน error แล้วแก้ได้ทันที

Chapter 06 — Flex Messages

	บท	หัวข้อ
06-01	Flex Message Overview	layout/components/sizing
06-02	Flex Simulator + Templates	12 template สำเร็จรูปพร้อมใช้
06-03	Flex Message + ChatGPT	Workshop ใบเสร็จ 7-Eleven

Chapter 07 — Firebase Storage

	บท	หัวข้อ
07-01	Firebase Storage	upload รูปภาพ/วิดีโอจาก LINE

Chapter 08 — Rich Menu

	บท	หัวข้อ
08-01	Rich Menu Overview	spec, areas, manager vs API
08-02	Workshop: Switch Action	สลับแท็บเมนูใน 1 คลิก

Chapter 09 — LIFF (LINE Front-end Framework)

	บท	หัวข้อ
09-01	LIFF Overview	เปลี่ยนแชทให้กลายเป็นเว็บแอป
09-02	LIFF Starter (Vue.js)	จาก 0 ถึงเปิดบนมือถือ
09-03	Get Profile	ดึงข้อมูลผู้ใช้โดยไม่ต้อง login เอง
09-04	LIFF Environment	ตรวจ OS / browser / API availability
09-05	Get Friendship	เช็คว่าเป็นเพื่อน LINE OA หรือยัง
09-06	Sending Message	sendMessages vs shareTargetPicker
09-07	Scan QR Code	เปิดกล้องสแกน QR/Barcode
09-08	LIFF CLI	จัดการ LIFF จาก Terminal + CI/CD

Chapter 10 — LINE MINI App

	บท	หัวข้อ
10-01	MINI App Overview	LIFF vs MINI App
10-02	MINI App Development	3-environment model
10-03	Service Message	ส่ง notification จาก MINI App
10-04	Home Screen Shortcut	ให้ผู้ใช้ปักหมุดที่หน้าโฮม

Chapter 11 — LINE Developer Tools Builder

	บท	หัวข้อ
11-01	Overview	สร้างเครื่องมือเพื่อ developer ด้วยกัน
11-02	Guide	ขั้นตอนสร้าง dev tool

---

ใช้ AI ช่วย Generate Code

skills/ เป็น Claude Skill / Cookbook สำหรับให้ AI generate code LINE API ได้แบบ production-ready:

Skill	ใช้ทำอะไร
line-api-skill	Index + Decision Guide เลือก sub-skill
line-api-common	Token rotation, 429 backoff, error handler patterns
line-webhook	Production webhook + Firestore idempotency + signature debug
line-messaging	Decision tree + multicast chunker + quota-aware sending
line-flex-message	6 recipes + modify-a-recipe playbook + debug checklist
line-rich-menu	Tab switching state machine + staged rollout + rollback
line-api-expert	Expert Agent — วิเคราะห์ requirement, แนะนำ feature, ออกแบบ architecture

วิธีใช้ (ตาม 9arm-skills standard):

# Install ผ่าน npx (แนะนำ)
npx skills add <repo-url>

# หรือ copy ทีละ skill ไปที่ ~/.claude/skills/
cp -r skills/line-messaging ~/.claude/skills/

---

โครงสร้างมาตรฐานของทุกบท

ทุกไฟล์ใน workshop/ ใช้โครงเดียวกัน อ่านง่ายและ map เข้า slide อัตโนมัติ:

1. Hook — ตัวอย่าง use case จริงที่จะได้ใช้
2. ทำไมต้องรู้เรื่องนี้? — analogy + แรงจูงใจ
3. ภาพรวม — Mermaid diagram (ส่วนใหญ่)
4. เนื้อหาหลัก — pattern, code, ตาราง spec
5. ข้อผิดพลาดที่มักเจอ — กับดักที่นักพัฒนาไทยเจอบ่อย
6. Checklist ก่อนไปต่อ — verify ตัวเองก่อนข้ามบท
7. อ้างอิง — link เอกสาร LINE ทางการ

---

References

• LINE Developers Documentation
• LINE Developers Console
• Flex Message Simulator
• LIFF Playground
• LINE API Status
• LINE Developers Thailand (Medium)

---

License & Credits

เอกสารนี้รวบรวมและเรียบเรียงโดย Thepnatee Phojan (LINE API Expert) — ใช้สอนใน workshop ของ Cloudea LINE Developer Workshop ผู้สนใจสามารถนำไปใช้ศึกษาส่วนตัวหรืออ้างอิงใน workshop ของตัวเองได้ ขอเครดิตผู้เขียนต้นฉบับ