AgentCon Bangkok (21 ก.พ. 2569)

สรุป Workshop: Low-to-No-Code Open Source Agentic Solution for Dev & Biz with Langflow จากงาน AgentCon Bangkok โดยคุณ Boat ชลันธร ลิ้มสีโล, Microsoft Learn Student Ambassador

🔶 สร้าง Gmail ส่งข้อความด้วย Langflow + API (Google AI Studio) + Docker + Microsoft Foundry

คุณโบ๊ทบอกว่า ตอนสร้าง Workflow ด้วย Gmail ต้องใช้ API และ เขาใช้ Google AI Studio ก็เพื่อเอา API key ของ Gemini มาเสียบให้ Langflow เรียกโมเดลได้เลย แบบง่ายสุด

💎 ขั้นตอนสร้าง API เพื่อเรียกใช้งาน
1. เข้า aistudio.google.com
2. กด get API key (อยู่แถวซ้ายล่างของหน้าเว็บ)
3. กด create an API key แล้วตั้งชื่อได้ เช่น Gemini API key หรือ Gemini API Langflow
4. เลือก project จะ import project เดิมก็ได้ หรือสร้าง project ใหม่เพื่อเก็บ key คุณ Boat สร้าง project ใหม่ชื่อ Gemini project แล้วกด create project
5. เลือก project เป็น Gemini project แล้วกด create key

🔷 ติดตั้ง Docker Desktop + เตรียม Langflow (Docker) ไว้สร้าง Gmail Agent

Langflow คือ แพลตฟอร์ม drag-and-drop แบบ low to no code
เราสร้าง AI solution ได้ตั้งแต่ simple chain ไปจนถึง RAG และ agentic flow ลาก components ที่มีให้มาเชื่อมกันได้เลย หรือถ้าอยากได้อะไรเฉพาะทาง ก็ทำ Custom Component เองได้ครับ
- มี Templates มากกว่า 60 Templates

คุณ Boat บอกว่า
1. เปิดแท็บใหม่แล้วค้นหา Docker Desktop
2. เข้าเว็บแล้วกด download Docker Desktop เลือกตาม operating system ของแต่ละคนครับ
3. จากนั้นให้ค้นหา Langflow on Docker
4. พอเจอให้กด deploy Langflow on Docker
5. พอเข้าหน้า Deploy Langflow Docker แล้ว ใช้ quick start
- copy คำสั่งแล้ว เอาไป paste ใน docker cli ได้เลย

📌 ต้องติดตั้ง Docker ให้เสร็จก่อน

✨ มีคำสั่งว่า
- conda activate langflow
- uv run langflow run

6. ตอนรันเสร็จ หากมีขึ้นลิงก์ว่า localhost ก็ ctrl แล้วคลิกเข้าไปเลย จะเป็นการเปิดตัว Homepage ของ Langflow

💻 Langflow ติดตั้งได้หลัก ๆ 4 แบบ
1. self-hosted ด้วย python environment
2. self-hosted ด้วย Docker (แบบที่เรากำลังทำ)
3. self-hosted ผ่าน Langflow desktop (แต่จะเสถียรน้อยกว่า)
4. ใช้แบบ online ผ่าน IBM Datastax (Datastax Langflow)

🔶 Workshop Part 1: ทำ Simple LLM Chain

1. กด Blank Flow เป็น Canvas หน้าเปล่า ๆ พร้อมที่จะสร้าง Node-Based Workflows ใน Langflow
2. ดูมุม Sidebar ฝั่งซ้าย เลือก Components สัญลักษณ์บนสุด (สัญลักษณ์เหมือนกับแพลตฟอร์ม Figma)
3. หาคำว่า Chat Input และลากเข้ามาใน Canvas
4. ลาก Chat Output มาวาง
5. ลาก Language Model มาวาง
6. เชื่อมสาย
🔹 Chat Input → input ของ model
🔹 Model Response ใน Language Model → chat output

7. ใส่ API key โดยการ copy Gemini API key ใน Google AI Studio
ใส่ในช่อง API Keys ของ Node Language Model
8. กลับมาที่ Langflow ตรง Model name เลือก Gemini 2.5 Flash

📌 ถ้าจะเช็คว่าเรียก API ไปเท่าไหร่ กดที่ Usage จะเห็นจำนวน request ที่ใช้ไปครับ

9. ไปที่ Playground (มุมขวาบน ใกล้กับปุ่ม Shares และ Icon Profile) แล้วลองพิมพ์ Hello เพื่อเทสต์ว่า API จาก Google ใช้งานได้ไหม

🔶 Workshop Part 2: ทำ Agent + เชื่อม Tools ผ่าน Composio (Gmail Workflow)

คุณ Boat บอกว่า ต่อไปเราจะทำ agent node และเชื่อม tools เพิ่ม
สิ่งที่ Agent ต้องมี:
- Model Provider
- Model Name
- API Key
- Agent Instructions
- Tools

1. ลบ Node Language Model แล้วลาก Agent มาแทนที่

📌 เพราะ Node Language Model ทำหน้าที่แค่ตอบข้อความ ตามอินพุต แต่ Agent = คิด + ตัดสินใจ + เรียกเครื่องมือ (Tools) ได้

2. เชื่อมสาย
🔹 Chat Input → Input ของ AI Model นั้น
🔹 Response ใน Node Agent Model → chat output

🔷 Composio Key

📌 Composio ช่วยให้มันไปทำงานในแอปอื่น ๆ ได้ เช่น Gmail, Slack, GitHub, Notion ฯลฯ ผ่าน Actions สำเร็จรูป

1. สร้าง API จากแพลตฟอร์ม Composio Key
2. ตั้งชื่อว่า Langflow workshop แล้วกด create
3. copy API key แล้วกลับไป Langflow

🔷 เพิ่ม Composio + Gmail Component ใน Langflow

1. ดูมุม Sidebar ใน Langflow เลือกหาคำว่า Composio
2. เลือก App Gmail ใน Composio แล้วลากมาวาง Canvas
3. วาง Composio API key ใน Node Gmail
4. สังเกตมุมขวาของ Node Gmail นี้ จะขึ้นเป็นสีส้ม แสดงถึง Composio API key ยังไม่เชื่อมต่อ คลิกเข้าไป จะปรากฎว่า Auth ให้เราทำการ Connect (มักเป็น OAuth2)
5. สลับ node เป็น tool mode ให้ขึ้นสถานะ tool set
6. พอสลับเสร็จ จะปรากฎแท็บ Actions ขึ้นมาตรงข้างล่างสุด
- ให้เราทำการกด configure the actions เพื่อสามารถกำหนดความสามารถการทำงานของ Gmail ว่า จะให้ Gmail ได้ Action ทำงานอะไรบ้าง
7. เลือก Actions ทั้ง 6 อัน:
🔹 Create draft
🔹 Delete draft
🔹 Get draft
🔹 List draft
🔹 Send draft
🔹 Update draft

8. ไปที่ Playground แล้วลองพิมพ์ว่า List me all drafts that I have written in Gmail.

📌 ถ้า Error ให้กลับไปที่ Agent แล้วตั้งค่าให้ครบ:
- Provider: Google Generative AI
- Paste Gemini API key (ระวังตรงนี้ให้ดี เลือก API Key ผิดก็ไม่ทำงาน)
- เลือก Model เช่น Gemini 2.5 Flash Lite Preview

แล้วกลับมาทดสอบใหม่ใน Playground

✨ ถ้าไม่ Error จะขึ้นว่า Finished แปลว่า ทดสอบผ่าน

🔶 สั่งให้สร้าง Email Draft (ลางานป่วย)

1. คุณ Boat พิมพ์ prompt ใน Playground ว่า I would create the draft for sending email to ............. (ชื่ออีเมลผู้รับ) about absent leave as I've got sick with flu, wanna leave for 2 days. Her real name is..........(ชื่อคน)

2. เข้าไปที่ Gmail ดูตรง Draft จะปรากฎกล่องข้อความ คลิกเข้าไปดู หากมีข้อความที่เราพิมพ์
- ชื่อผู้ส่ง
- หัวข้อเรื่อง
- เนื้อหาจดหมายลาป่วย

หากไม่อัปเดต ให้กด Refresh ใน Gmail ครับ

นอกจากนี้สามารถสั่งให้ Agent Update Draft ได้ด้วย
เช่น เปลี่ยนชื่อเป็น Charunthon L แล้วกำหนดวันกลับเป็น 24th February
แล้วให้มัน Update Draft และ Sync กลับไป Gmail ใหม่ได้ครับ

📌 ข้อจำกัดที่อาจเจอ คือ Token / Rate Limit / Resource Exhausted

คุณ Boat บอกว่า ถ้าใช้ Agent หนัก ๆ มันจะกิน tokens เยอะ เพราะต้องคุยทั้งกับ tools และกับ model บางทีอาจขึ้นว่า resource exhausted ได้

- ถ้าจะเช็ค ให้ดูที่ rate limit หรือ usage (Google AI Studio, Composio จาก API Key ที่เราสร้างไว้)
- ถ้าใกล้เต็ม อาจเปลี่ยน model หรือเปลี่ยนบัญชี เพื่อทดสอบต่อได้ครับ

👉 การทำ AI ที่ทำงานแทนเราได้จริง แบบลากวางด้วย Langflow ไม่ต้องเริ่มจากโค้ดยาว ๆ ให้เริ่มจากคุยตอบได้ก่อนด้วย Gemini ผ่าน Google AI Studio แล้วค่อยยกระดับเป็น Agent ที่ไปทำงานแทนได้จริงด้วย Composio

เช่น Demo ให้มันจัดการ draft ใน Gmail ได้ จุดคุ้ม คือ ทำต้นแบบไว ลดงานซ้ำในองค์กร และเปลี่ยนเครื่องมือที่เชื่อมก็เอาแนวคิดเดียวกันไปใช้กับงานอื่นได้ทันที กลายเป็นสั่งครั้งเดียวแล้ว ระบบจัดการให้ครบแบบเห็นผลไวและเอาไปใช้จริงได้เลย

💛 ติดตามเพจเราไว้ เพื่อรับความรู้สาระดี ๆ แบบนี้ได้ประจำครับ

#ใช้aiให้ดีต้องมีinsight #insightist #AI #topic #idea #EventInsight #GlobalAICommunity #AgentConBangkok #Agent #KBTG #Microsoft #NextFlow #MicrosoftMVP #CharunthonLimseelo #Langflow #Composio #GoogleAIStudio #Gemini #Docker