ถ้าเว็บที่สร้างด้วย AI เป็น Next.js ให้เริ่มที่ Vercel เพราะตั้งค่าน้อยที่สุด ถ้าเป็นเว็บ static หรืออยากได้ free plan ที่ไม่คิดค่า bandwidth ให้ดู Cloudflare Pages ส่วนงานที่ใช้ Firebase อยู่แล้วก็วางบน Firebase Hosting ได้เลย งานที่เป็น demo หรือเกมไฟล์ HTML ล้วนใช้ GitHub Pages ก็พอ และงานที่ต้องมี server รันตลอดเวลาค่อยขยับไป Railway หรือเช่า server เอง
คำถามว่า deploy ที่ไหนดีเป็นด่านแรกที่คนสร้างเว็บด้วย Claude Code, Codex หรือ Cursor เจอเหมือนกันหมด เขียนโค้ดเสร็จในเครื่องแล้ว แต่ยังส่งลิงก์ให้ใครดูไม่ได้ บทความนี้เทียบตัวเลือกหลักทีละตัว โดยดูจากผลงานจริงในทำเนียบแอปเทพที่มีอยู่ 1705 รายการ ว่าคนไทยที่ทำเว็บด้วย AI เขาวางงานกันไว้ที่ไหน
ตารางเทียบ hosting แต่ละแบบ
| Hosting | เหมาะกับงานแบบไหน | ข้อควรรู้ | ตัวอย่างในแอปเทพ |
|---|---|---|---|
| Vercel | เว็บ Next.js และเว็บที่อยากให้ push แล้วขึ้นเองทันที | free plan กำหนดให้ใช้กับงานส่วนตัวที่ไม่ใช่เชิงพาณิชย์ | เครื่องคำนวณบำเหน็จบำนาญ |
| Cloudflare Pages | เว็บ static และเว็บที่คาดว่าจะมีคนเข้าเยอะ | Next.js ที่ใช้ความสามารถฝั่ง server ต้องตั้งค่า adapter เพิ่ม | Nuad Thai and Wellness EXPO |
| Firebase Hosting | งานที่ใช้ Firebase เป็น backend อยู่แล้ว | ผูกกับบัญชี Google และบริการในชุด Firebase | เกมซิ่งรถฝึกภาษา |
| GitHub Pages | demo, เกม, เอกสาร ที่เป็นไฟล์ static ล้วน | รันโค้ดฝั่ง server ไม่ได้ และไม่ได้ออกแบบมาให้ทำร้านค้า online | CreaturesOS |
| Railway | งานที่ต้องมี server รันค้างไว้ หรือมีระบบหลังบ้าน | คิดเงินตามการใช้งานจริง | Lucy Summer Bracelet Designer |
| Server ของตัวเองกับ Nginx | คนที่อยากคุมทุกอย่างเอง | ต้องดูแล SSL, การอัปเดต และ backup เอง | Parisec |
เงื่อนไขของ free plan เปลี่ยนได้ตลอด ก่อนตัดสินใจควรเปิดหน้า pricing ของแต่ละเจ้าดูอีกครั้ง
3 คำถามที่ต้องตอบก่อนเลือก
เว็บของเรามีโค้ดฝั่ง server ไหม
เว็บ static คือเว็บที่ build ออกมาเป็นไฟล์ HTML, CSS และ JavaScript แล้วจบ วางที่ไหนก็ได้ ตัวเลือกจึงกว้างมาก แต่ถ้าเว็บมี API ของตัวเอง มีการประมวลผลฝั่ง server หรือต้องรัน process ค้างไว้ ตัวเลือกจะแคบลงทันที วิธีเช็กง่ายที่สุดคือถาม AI ที่ช่วยเขียนโค้ดตรง ๆ ว่า project นี้ build เป็น static ได้ทั้งหมดไหม หรือมีส่วนไหนต้องรันบน server
ข้อมูลเก็บไว้ที่ไหน
Hosting กับ database เป็นคนละเรื่องกัน เว็บ static ก็มีข้อมูลได้ ถ้าเรียกใช้ backend ภายนอกอย่าง Supabase หรือ Firebase คนที่เพิ่งเริ่มมักเข้าใจว่าต้องหา hosting ที่มี database ในตัว ซึ่งไม่จำเป็น
เว็บนี้ทำเงินหรือเปล่า
free plan หลายเจ้ามีเงื่อนไขเรื่องการใช้เชิงพาณิชย์ ถ้าเป็นเครื่องมือแจกฟรีหรืองานทดลองก็ใช้ได้สบาย แต่ถ้าเป็นเว็บขายของหรือรับชำระเงิน ควรอ่านเงื่อนไขให้จบก่อน จะได้ไม่ต้องย้ายตอนที่ลูกค้าเริ่มเข้า
Vercel ตัวเลือกแรกของคนใช้ Next.js
Vercel เป็นบริษัทที่พัฒนา Next.js เอง การ deploy จึงแทบไม่ต้องตั้งค่าอะไร เชื่อม repo จาก GitHub ครั้งเดียว หลังจากนั้นทุกครั้งที่ push เว็บจะ build และขึ้นใหม่เอง แต่ละ branch ยังได้ลิงก์ preview แยกไว้ให้ทดสอบก่อนปล่อยจริง
ตัวอย่างในทำเนียบคือ เครื่องคำนวณบำเหน็จบำนาญ เครื่องมือประมาณการบำเหน็จบำนาญสำหรับข้าราชการ รองรับกรณีเกษียณอายุและกรณีอื่นที่เกี่ยวข้อง สร้างด้วย Next.js กับ Tailwind และวางบน Vercel ที่อยู่เว็บเป็น early-retire.vercel.app ซึ่งเป็น subdomain ที่ platform ให้มา เครื่องมือแบบนี้เปิดให้คนใช้ได้โดยยังไม่ต้องซื้อ domain
Cloudflare Pages เมื่อกังวลเรื่องคนเข้าเยอะ
จุดที่คนพูดถึง Cloudflare Pages มากที่สุดคือ free plan ไม่คิดค่า bandwidth สำหรับไฟล์ static เว็บที่มีโอกาสถูกแชร์เป็นวงกว้างจึงไม่ต้องลุ้นบิลปลายเดือน นอกจากนี้ยังเขียนโค้ดฝั่ง server แบบเบา ๆ ผ่าน Functions ได้
ข้อที่ต้องระวังคือ Next.js ที่ใช้ความสามารถฝั่ง server เต็มรูปแบบต้องตั้งค่า adapter เพิ่ม ไม่ได้ราบรื่นเท่าบน Vercel ถ้าจะไปทางนี้ควรบอก AI ตั้งแต่เริ่ม project ว่าจะ deploy บน Cloudflare โค้ดจะได้ถูกวางโครงให้เข้ากันตั้งแต่ต้น
Nuad Thai and Wellness EXPO เป็นตัวอย่างที่ใช้ Next.js กับ Tailwind บน Cloudflare Pages เว็บนี้รองรับการลงทะเบียนงานและการจองคิวนวดภายในงาน ผู้เข้าร่วมยังกดให้กำลังใจเพื่อดู animation โคมยี่เป็งลอยขึ้นได้ด้วย
Firebase Hosting เมื่อใช้ Firebase เป็น backend
ถ้า project ใช้ Firebase เก็บข้อมูลหรือทำระบบ login อยู่แล้ว การวางหน้าเว็บไว้ที่ Firebase Hosting ช่วยให้ทุกอย่างอยู่ใน console เดียว ใช้คำสั่งจาก Firebase CLI ไม่กี่คำสั่งก็ขึ้นเว็บได้ และมี free plan ให้เริ่มต้น
เกมซิ่งรถฝึกภาษา ใช้แนวทางนี้ ตัวเกมเป็นกิจกรรมฝึกภาษาสำหรับเด็ก เล่นได้บน PC ผ่าน web และโทรศัพท์มือถือบางรุ่น หน้าเว็บใช้ Bootstrap วางบน Firebase Hosting และใช้ Firebase เป็น backend
GitHub Pages สำหรับ demo และงานทดลอง
GitHub Pages เสิร์ฟได้เฉพาะไฟล์ static แต่แลกมากับความง่าย เพราะโค้ดอยู่บน GitHub อยู่แล้ว เปิดใช้ใน settings ของ repo ก็ได้ลิงก์ทันที ส่วน free plan ต้องเป็น repo แบบ public
ข้อจำกัดเรื่องรันโค้ดฝั่ง server ไม่ได้ แก้ได้ด้วยการต่อ backend ภายนอก CreaturesOS เป็นเกมเลี้ยงสัตว์เวทมนตร์บน ESP32 ที่ผู้ใช้เสียบอุปกรณ์แล้ว flash ผ่านหน้า web ได้ หน้าเว็บวางบน GitHub Pages และใช้ Supabase เป็น backend แสดงให้เห็นว่า hosting แบบ static ก็รองรับงานที่มีลูกเล่นได้
Railway และ server ของตัวเอง
งานบางแบบต้องมี server รันตลอดเวลา เช่น ระบบที่มีหลังบ้านให้ admin ใช้ หรืองานที่ต้องประมวลผลนาน Railway รับ repo ไป build แล้วรันให้เป็น service พร้อมเพิ่ม database ใน project เดียวกันได้ ค่าใช้จ่ายคิดตามการใช้งานจริง
Lucy Summer Bracelet Designer วางอยู่บน Railway และใช้ LINE LIFF ลูกค้าออกแบบกำไลเองแล้วสั่งซื้อได้จริง ระบบเชื่อมกับ admin หลังบ้านเพื่ออัปเดตสถานะและลดงานของผู้ดูแล
อีกทางคือเช่า server แล้วตั้ง Nginx เอง แบบที่ Parisec ใช้ เว็บนี้ตรวจหาช่องโหว่ของ website ด้วย pentest แบบง่าย และเปิดให้ใช้ฟรีสำหรับคนที่อยากตรวจโค้ดที่สร้างด้วย AI ทางนี้ได้อิสระเต็มที่ แต่ต้องดูแล SSL, การอัปเดตระบบ และ backup เองทั้งหมด เหมาะกับคนที่พร้อมเรียนรู้เรื่อง server
ขั้นตอน deploy ครั้งแรกด้วย Claude Code
- สั่งให้ AI รัน build ในเครื่องให้ผ่านก่อน ถ้า build ในเครื่องไม่ผ่าน ขึ้น hosting ก็ไม่ผ่านเหมือนกัน
- ให้ AI ตรวจว่าไฟล์
.envอยู่ใน.gitignoreแล้ว เพื่อไม่ให้ API key หลุดขึ้น repo - push โค้ดขึ้น GitHub
- เชื่อม repo กับ hosting ที่เลือก หรือให้ AI ใช้ CLI ของ hosting นั้น deploy ให้
- ใส่ environment variable ในหน้าตั้งค่าของ hosting ให้ครบทุกตัวที่ใช้ในเครื่อง
- เปิดลิงก์จริงบนมือถือ แล้วลองใช้ทุกปุ่มด้วยตัวเอง
ตัวอย่าง prompt ที่ใช้ได้เลยคือ "ตรวจ project นี้ว่าพร้อม deploy บน Cloudflare Pages ไหม ถ้ายังไม่พร้อมให้บอกว่าต้องแก้อะไร แล้วแก้ทีละจุด" การระบุชื่อ hosting ลงไปใน prompt ช่วยให้ AI เช็กข้อจำกัดได้ตรงจุด
ปัญหาที่เจอบ่อยหลัง deploy
- เว็บขึ้นแต่ข้อมูลไม่มา มักเกิดจากลืมใส่ environment variable บน hosting
- หน้าแรกเปิดได้ แต่ refresh หน้าอื่นแล้วเจอ 404 เกิดกับเว็บ static ที่ยังไม่ได้ตั้งค่า routing
- ในเครื่องใช้ได้ แต่บน hosting พัง เพราะโค้ดเขียนไฟล์ลง disk ซึ่ง hosting หลายแบบไม่เก็บไฟล์ให้ถาวร
- ใส่ API key ไว้ในโค้ดฝั่งหน้าเว็บ ทำให้ใครก็เปิดดูได้ ควรย้ายไปเรียกผ่านฝั่ง server
ทุกข้อแก้ได้ด้วยการคัดลอกข้อความ error จากหน้า log ของ hosting ไปให้ AI อ่าน อย่าเล่าอาการเอง เพราะ log บอกสาเหตุได้ตรงกว่า
สรุป
อย่าเสียเวลาเลือกนานเกินไป เว็บ Next.js เริ่มที่ Vercel เว็บ static เริ่มที่ Cloudflare Pages หรือ GitHub Pages งานที่ใช้ Firebase ก็อยู่กับ Firebase Hosting ต่อ ส่วนงานที่ต้องมี server ค่อยไป Railway การย้ายทีหลังทำได้เสมอ ตราบใดที่โค้ดอยู่บน GitHub สิ่งที่สำคัญกว่าคือมีลิงก์จริงส่งให้คนลองใช้ให้เร็วที่สุด และเมื่อเว็บขึ้นแล้วก็นำมาลงในทำเนียบแอปเทพให้คนอื่นได้เห็นผลงานด้วย
