~/VibeHandbook
PDF ฟรี

บท 16 · 01

เลือกโฮสต์และ Deploy

สำหรับแอปที่สร้างด้วย vibe coding ส่วนใหญ่ คุณไม่จำเป็นต้องมีเซิร์ฟเวอร์ที่ต้องคอยเลี้ยงดูเอง แพลตฟอร์มยุคใหม่รับโค้ดของคุณแล้วให้ ที่ใช้งานได้จริงภายในไม่กี่นาที ตัวเลือกที่พบบ่อย:

  • เว็บไซต์แบบ static และ : Cloudflare Pages, Vercel, Netlify, GitHub Pages
  • แอปแบบ full-stack และ (Application Programming Interface หรือประตูที่โปรแกรมหนึ่งใช้คุยกับอีกโปรแกรมหนึ่ง): Cloudflare Workers, Vercel, Render, Fly.io, Railway
  • แบ็กเอนด์ที่หนักกว่านั้น: แพลตฟอร์ม หรือ VPS ขนาดเล็ก (Virtual Private Server หรือคอมพิวเตอร์ส่วนแบ่งที่คุณเช่าไว้เอง ทำงานตลอดเวลาในศูนย์ข้อมูล)

ทางที่ถูกต้องคือบอก AI ว่าคุณสร้างอะไรมาแล้วให้มันแนะนำ ลองพิมพ์ว่า: "นี่คือแอป Next.js ที่มีฐานข้อมูล Postgres ฉันต้องการโฮสต์ที่ถูกที่สุดแต่เชื่อถือได้ และมี free tier ที่ให้เยอะ ช่วยบอกขั้นตอนการ พร้อมไฟล์คอนฟิกให้หน่อย" ให้ระบุสิ่งที่จำกัดตัวเลือกจริง ๆ ให้ชัดเจน: เฟรมเวิร์กของคุณ มีฐานข้อมูลหรือไม่ ต้องมี background job หรือการอัปโหลดไฟล์หรือไม่ และงบประมาณของคุณ หน้าเว็บการตลาดแบบ static กับแอป full-stack ที่มีคิวงานนั้นมีบ้านที่ต่างกันมาก

เมื่อเลือกได้แล้ว การ deploy มักจะเป็นแค่คำสั่งไม่กี่บรรทัด:

# Example: Cloudflare Workers via Wrangler
npm install -g wrangler
wrangler login
wrangler deploy

# Example: Vercel
npm install -g vercel
vercel --prod

ให้ AI สร้างไฟล์คอนฟิกของแพลตฟอร์ม (wrangler.toml, vercel.json ฯลฯ) และอธิบายข้อผิดพลาดใด ๆ ที่การ deploy ครั้งแรกโยนออกมา การ deploy ครั้งแรกแทบจะโยนข้อผิดพลาดออกมาเสมอ — คำสั่ง build ที่หายไป ไดเรกทอรีเอาต์พุตที่ผิด เวอร์ชัน Node ที่ไม่ตรงกัน หรือตัวแปรสภาพแวดล้อม ( หรือค่าคอนฟิกที่มีชื่อกำกับ ซึ่งถูกส่งให้แอปของคุณจากภายนอกโค้ด เหมือนกุญแจที่ซ่อนไว้ใต้พรมเช็ดเท้าที่แอปรู้ว่าต้องไปหา) ที่ build ต้องการแต่หาไม่เจอ ไม่มีข้อไหนหมายความว่าคุณทำอะไรโง่ ๆ มันแค่หมายความว่าแพลตฟอร์มต้องการให้บอกอีกสักอย่าง วางข้อความ error กลับไปแบบคำต่อคำแล้วขอวิธีแก้ พร้อมถามว่า ทำไม มันถึงเกิดขึ้น เพื่อให้ครั้งต่อไปคุณประหลาดใจน้อยลง สักสองสามรอบคุณก็จะขึ้นออนไลน์บน URL ชั่วคราวได้ เปิด URL นั้นแล้วลองคลิกไล่ดูโฟลว์หลักก่อนที่จะฉลอง — "การ deploy สำเร็จ" กับ "แอปทำงานได้จริง" ไม่ใช่คำกล่าวอ้างเดียวกัน

ทุกการ deploy เดินตามไปป์ไลน์เดียวกัน ขั้นตอน preview คือตาข่ายนิรภัยของคุณ: มันให้ทุกการเปลี่ยนแปลง URL ของตัวเองที่คลิกดูได้ก่อนที่มันจะแตะต้องผู้ใช้จริง

   YOUR MACHINE              THE PLATFORM
 ┌──────────────┐
 │  write code  │
 │  git commit  │
 │  git push    │
 └──────┬───────┘
        │  push
        ▼
 ┌──────────────┐   fail   ┌──────────────────┐
 │    BUILD     ├─────────▶│  read error,     │
 │ install deps │          │  fix, push again │
 │ compile      │◀─────────┤  (2–3 rounds)    │
 └──────┬───────┘   retry  └──────────────────┘
        │  pass
        ▼
 ┌──────────────┐
 │   PREVIEW    │  temporary URL — click the core flow here
 │  *.pages.dev │  ── share · test · verify ──┐
 └──────┬───────┘                             │
        │  looks good?  ──── no ──────────────┘
        │  yes
        ▼
 ┌──────────────┐
 │  PRODUCTION  │  your real domain · real users
 └──────────────┘

อยากได้แบบออฟไลน์?

ดาวน์โหลดหนังสือทั้งเล่มเป็น PDF หรือ EPUB — ฟรี