Export โปรเจคและส่งต่อให้ Developer

มีอยู่ช่วงนึงเว็บบริษัทผมโตเกินที่ Lovable จะทำต่อได้สบาย — เริ่มต้องเชื่อม LINE Notify, สร้างหน้า admin ที่ซับซ้อน — ผมเลยตัดสินใจ export ออกไปให้ freelance ทำต่อ

ตอนนั้นผมไม่รู้วิธีส่งงาน ผมแค่ส่ง URL ของ Lovable ไปให้เขา เขาก็งงครับ ทำไม่ถูก

หลังจากนั้นผมเรียนรู้วิธี handoff ที่ดี — บทนี้เล่าให้ฟัง

ทำไมควร Export ตั้งแต่แรก

เหตุผลที่ผมยึดเป็นกฎ — export อย่างน้อย 1 ครั้งหลังจบเวอร์ชันแรก

• ไม่อยากผูกติดกับ platform เดียว ถ้าวันหนึ่ง Lovable ขึ้นราคา 3 เท่า เราย้ายได้
• แก้เกินที่ no-code ทำได้ ส่งต่อให้ freelance ได้ทันที
• เซฟเงิน อยู่ Lovable Pro = $25/เดือน vs hosting Vercel = ฟรี
• Backup ป้องกัน ถ้าเกิดอะไรกับ Lovable เราไม่เสียทั้งหมด

วิธี Export

จาก Lovable

1. ไปที่ project ของคุณ → ปุ่ม "GitHub" มุมขวาบน
2. Connect GitHub account → "Create repository"
3. Lovable push โค้ดทั้งหมดขึ้น GitHub ใช้เวลา 1-2 นาที
4. Clone มาที่เครื่อง หรือส่งให้ freelance ผ่าน GitHub invite

ของที่ได้ส่วนใหญ่: Vite + React + Tailwind + (Supabase ถ้ามี database)

จาก v0

1. คลิกปุ่ม "Code" บน component
2. ก็อปโค้ด
3. วางในโปรเจคที่มีอยู่
4. Install dependencies ที่ component ต้องการ

ของที่ได้: React component + shadcn/ui (ไม่มี backend)

จาก Google AI Studio
ไม่ export ตรงๆ ได้ — แต่ก็อป prompt + เอาไปเรียก API ในโค้ดของตัวเอง

เตรียมก่อนส่งให้ Developer

จากที่ผม handoff มาหลายครั้ง 4 อย่างนี้คือสิ่งที่ต้องมี

1. Access ที่ครบ

• Invite developer เข้า GitHub repo
• ให้ access Lovable project (ถ้าจะแก้ใน Lovable ต่อด้วย)
• ส่ง environment variables (secrets) — ห้ามส่งใน chat ปกติ ใช้ password manager หรือ 1Password share

2. README ของโปรเจค

ผมให้ Claude ช่วยเขียน เพราะเขียนเองมักลืมรายละเอียด

ขอช่วยเขียน README.md สำหรับ handoff โปรเจคให้ developer ภายนอก

ข้อมูลโปรเจค:
- ชื่อ: [...]
- คำอธิบายสั้น 2-3 บรรทัด: [...]
- Tech stack ที่ Lovable เลือกให้: [Lovable มักบอกใน sidebar]
- สิ่งที่เสร็จแล้ว: [list]
- สิ่งที่ยังไม่เสร็จ: [list]
- สิ่งที่อยากให้ developer ทำต่อ: [list]

README ขอครอบคลุม:
1. ภาพรวมโปรเจค + URL preview
2. วิธีรัน local (install, dev, build)
3. โครงสร้างไฟล์สำคัญ
4. Environment variables ที่ต้องตั้ง — บอกชื่อแต่ไม่ใส่ค่า
5. ข้อควรรู้ / known issues
6. วิธี deploy
7. ติดต่อใครเมื่อสงสัย

ภาษาไทยผสมคำเทคนิคอังกฤษได้

3. Brief งานที่ชัด

อันนี้คือสิ่งที่ผมพลาดบ่อยตอนแรก — ส่งงานไปแบบ "ทำต่อให้ดี" ผลคือ scope กว้าง freelance งง คุยราคายาก

ขอช่วยร่าง brief 1 หน้า สำหรับส่งงานให้ freelance developer ทำต่อ

ข้อมูล:
- ชื่อโปรเจค + ตอนนี้อยู่ที่: [URL ของ Lovable preview / repo]
- งบ: [ช่วงราคาที่จ่ายได้]
- เวลา: [ต้องการเสร็จภายใน...]

ขอบเขตงานที่อยากให้ทำต่อ:
[เขียนรายการให้ครบ — ต้องการอะไรบ้าง]

Brief ขอประกอบด้วย:
- Context สั้นๆ (เราเป็นใคร โปรเจคคืออะไร)
- Scope แยกชัด: Must-have / Nice-to-have
- Acceptance criteria — เช็คยังไงว่าเสร็จ
- สิ่งที่ขอจาก freelance: ตัวอย่างผลงาน / availability / วิธี communication

โทน: มืออาชีพแต่อ่านง่ายแบบไทย — ไม่ corporate จัด

4. Test plan

รายการที่ใช้ตรวจรับงาน — เหมือน checklist ตรวจรับงานก่อสร้าง

ตรวจก่อนรับงาน:
- [ ] เปิดหน้าหลักได้บน desktop / tablet / มือถือ
- [ ] ฟอร์มกรอกได้สำเร็จ ข้อมูลเข้า database
- [ ] หน้า admin login/logout ใช้ได้
- [ ] ไม่มีลิงก์ไหนเปิดแล้วเจอ 404
- [ ] โหลดในเวลาน้อยกว่า 3 วินาทีบน 4G
- [ ] SEO basics: title, description, OG image ครบ

ค่าใช้จ่ายต่อเดือนถ้าย้ายออก

ผมเทียบให้ดู

vs อยู่บน Lovable Pro = ~875 บาท/เดือน

ถ้าไม่มีทีม ไม่เปลี่ยนบ่อย อยู่ Lovable ก็ถูกกว่า ถ้าสเกลเริ่มใหญ่หรือมี dev ทีม ย้ายออกคุ้มกว่า

ปิดระดับ ม.ต้น

ถึงจุดนี้คุณทำสิ่งเหล่านี้ได้แล้ว

• รู้จัก no-code AI tools หลัก
• สร้าง landing page + ฟอร์มของบริษัท
• Iterate design จนได้ที่ใจ
• รู้ว่าเมื่อไหร่ต้องหยุดและหาคนช่วย
• Handoff งานให้ freelance อย่างมืออาชีพ

ระดับถัดไปจะเข้า Claude Desktop + Projects + MCP — ตรงนี้เปลี่ยนการใช้ AI ของผมไปอีกขั้น เพราะ Claude เริ่มเข้าถึงไฟล์ในเครื่อง, Notion, Google Drive ของผมได้ — ทำงานได้กว้างกว่าแค่แชทเยอะ