ZenityX Class Handout

เชื่อม Claude × Cloudflare

ให้ AI มีมือมีเท้าบนคลาวด์ — สร้างเว็บไซต์และระบบส่วนตัวของคุณเอง

A รู้จัก 3 ตัวละครหลักก่อนเริ่ม

Cloudflare

= ที่ดิน + โรงไฟฟ้า

โครงสร้างพื้นฐานบนอินเทอร์เน็ต — มีที่วางเว็บ (Pages), คนงานรันโค้ด (Workers), ตู้เก็บของ (KV), ฐานข้อมูล (D1) และสมอง AI (Workers AI) — เริ่มใช้ฟรีได้ทั้งหมด

Wrangler

= รีโมทคอนโทรล

เครื่องมือบรรทัดคำสั่ง (CLI) อย่างเป็นทางการของ Cloudflare ใช้ deploy เว็บ สร้างฐานข้อมูล จัดการทุกอย่างโดยไม่ต้องเปิดหน้าเว็บ — Claude เป็นคนกดรีโมทให้ เราไม่ต้องจำคำสั่งเอง

API Token

= กุญแจ

รหัสลับที่เสียบให้รีโมททำงานได้ ระบุว่าเป็นบัญชีของใคร และทำอะไรได้บ้าง (scope) — กุญแจยิ่งแคบ ยิ่งปลอดภัย

คุณพิมพ์สั่งเป็นภาษาคน

→

Claudeแปลงเป็นคำสั่ง

→

Wranglerรีโมทคอนโทรล

→

Tokenกุญแจยืนยันสิทธิ์

→

Cloudflareเว็บออนไลน์จริง

Q: ต้องติดตั้ง Wrangler ก่อนไหม? — ไม่ต้อง! เราเรียกผ่าน npx wrangler ซึ่งจะดาวน์โหลดให้อัตโนมัติครั้งแรกที่ใช้ ขอแค่เครื่องมี Node.js ก็พอ

B เตรียมเครื่องก่อนเข้าคลาส

Node.js LTS — ดาวน์โหลดจาก nodejs.org · ไม่แน่ใจว่าเครื่องมีแล้วหรือยัง? เปิด Claude Code แล้วถามว่า "เครื่องฉันมี Node.js หรือยัง" ได้เลย
Claude Code — เปิดใช้งานได้แล้วในเครื่อง
บัญชี Cloudflare (ฟรี) — สมัคร/ล็อกอินที่ dash.cloudflare.com

C เชื่อมระบบใน 4 ขั้นตอน — ไม่ต้องแตะ Terminal เลย

สร้าง API Token (กุญแจของเรา)

ไปที่ dash.cloudflare.com/profile/api-tokens → กด Create Token → เลื่อนลงล่างสุด เลือก Create Custom Token → ตั้งชื่อ เช่น claude-class แล้วเพิ่มสิทธิ์ตามตารางนี้ให้ครบ 7 รายการ:

ระดับ	Permission	สิทธิ์	ใช้ทำอะไร
Account	Cloudflare Pages	Edit	deploy เว็บไซต์ (ได้โดเมนฟรี `*.pages.dev`)
Account	Workers Scripts	Edit	สร้างระบบส่วนตัว / API / webhook
Account	Workers KV Storage	Edit	เก็บข้อมูลแบบ key-value
Account	D1	Edit	ฐานข้อมูล SQL ฟรี
Account	Workers AI	Edit	เรียกโมเดล AI บนคลาวด์ของเราเอง ⭐
Account	Account Settings	Read	ให้เครื่องมือหา account ID เจอ
User	User Details	Read	ใช้ตรวจสอบ token

ตรง TTL ให้ตั้งวันหมดอายุ (แนะนำ 90 วัน) → กด Continue to summary → Create Token

วางกุญแจลงไฟล์ด้วย Notepad / TextEdit

Token จะโชว์แค่ครั้งเดียว! คัดลอกทันทีก่อนปิดหน้า — ถ้าพลาดให้ลบทิ้งแล้วสร้างใหม่ได้ ไม่เสียอะไร

เปิดแอปจดโน้ตที่มากับเครื่อง — Notepad (Windows) หรือ TextEdit (Mac) — วาง token ลงไป แล้วบันทึกไว้ที่ Desktop ตั้งชื่อไฟล์ว่า cloudflare-token.txt

เฉพาะ TextEdit (Mac): กด Format → Make Plain Text (Shift+Cmd+T) ก่อนวาง token เสมอ — ถ้าปล่อยเป็น Rich Text ตัวอักษรในกุญแจอาจถูกแอบแก้จนใช้ไม่ได้

ส่งงานต่อให้ Claude จัดการ

เปิด Claude Code แล้ว copy prompt นี้ไปวาง — Claude จะย้ายกุญแจไปเก็บให้ถูกที่ ตั้งสิทธิ์ ตรวจสอบ และทดสอบให้ครบจบในครั้งเดียว:

PROMPT สำเร็จรูป ฉันเก็บ Cloudflare API token ไว้ที่ไฟล์ cloudflare-token.txt บน Desktop ช่วยจัดการให้หน่อย:
1) ย้ายไปเก็บที่ ~/.cloudflare_api_token ในรูปแบบที่ถูกต้อง (ตัดช่องว่าง/บรรทัดว่างที่ติดมาออก)
2) ตั้งสิทธิ์ไฟล์ให้ปลอดภัย
3) ตรวจสอบกับ Cloudflare ว่า token ใช้งานได้จริง
4) ทดสอบ wrangler ผ่าน npx ให้เห็นชื่อบัญชีของฉัน
5) เสร็จแล้วลบไฟล์บน Desktop ทิ้งด้วย

เช็คงาน: Claude ต้องรายงานว่า token ผ่านการตรวจสอบ + ขึ้นชื่อบัญชี Cloudflare ของเรา + ลบไฟล์บน Desktop แล้ว — ครบ 3 อย่าง = เชื่อมสำเร็จ

ภารกิจแรก — สั่ง Claude เป็นภาษาคน

เปิด Claude Code แล้วลอง copy prompt นี้ไปวาง:

PROMPT ตัวอย่าง สร้างเว็บ portfolio ง่ายๆ 1 หน้า แนะนำตัวฉัน แล้ว deploy ขึ้น Cloudflare Pages ให้หน่อย — token อยู่ที่ไฟล์ ~/.cloudflare_api_token ให้อ่านจากไฟล์โดยตรง (อย่าพึ่ง env var จาก .zshrc)

ถ้าได้ลิงก์ https://ชื่อโปรเจกต์.pages.dev กลับมาและเปิดเว็บติด = จบภารกิจ 🎉

D กฎความปลอดภัย 4 ข้อ (สำคัญที่สุดในคลาสนี้)

ห้ามใช้ Global API Key เด็ดขาด — ปุ่มอยู่ในหน้าเดียวกัน แต่มันคุมทั้งบัญชีและจำกัดสิทธิ์ไม่ได้ ถ้าหลุดคือเสียทุกอย่าง — ใช้ Custom Token เท่านั้น
Token = ความลับ — ห้ามแชร์ ห้ามโพสต์ลงโซเชียล ห้ามวางไว้ในโค้ด ห้าม commit ลง git และห้ามวางตรงๆ ในแชท (มันจะค้างอยู่ในประวัติแชทถาวร) — ความลับส่งผ่านไฟล์แบบขั้น 2 เสมอ
ขอสิทธิ์แคบไว้ก่อน — วันนี้ยังไม่ต้องมี R2 / DNS / Queues บทเรียนไปถึงเมื่อไหร่ค่อยกลับไปเพิ่มในหน้า token เดิมได้เสมอ
ตั้งวันหมดอายุเสมอ — และถ้าสงสัยว่า token หลุด ให้ไปหน้า api-tokens แล้วกด Revoke ทิ้งได้ทันที (สร้างใหม่ได้ ไม่เสียอะไร)

💡 เครื่อง Windows: Notepad เป็น plain text อยู่แล้ว ใช้ได้เลยไม่ต้องตั้งค่าอะไร — แค่เติมท้าย prompt ในขั้น 3 ว่า "ฉันใช้ Windows" Claude จะเลือกตำแหน่งเก็บไฟล์ให้เหมาะกับเครื่องเอง

ZenityX — จับมือทำจริง ใช้ได้จริง zenityx.com