อัปโหลดเว็บให้คนทั้งโลกเห็นได้ในไม่กี่คลิก
เหมาะกับผู้ที่สร้างเว็บไซต์เสร็จแล้ว และอยากเอาเว็บขึ้นออนไลน์ฟรี โดยไม่ต้องมีเซิร์ฟเวอร์ของตัวเอง
ตัวอย่างเว็บที่สามารถ Deploy ได้
- เว็บ HTML/CSS/JS ธรรมดา (Static Website)
- React, Vue, Next.js, Svelte (ผ่าน Vercel)
- เว็บ Portfolio / Resume / หน้าแนะนำตัว
- เว็บโปรเจกต์นักศึกษา
Part 1: Deploy เว็บไซต์แบบ Static ด้วย GitHub Pages
Step 1: สร้าง GitHub Repository
- ไปที่ https://github.com แล้วสมัคร / ล็อกอิน
- คลิก “New” เพื่อสร้าง Repository ใหม่
- ตั้งชื่อ เช่น
my-portfolio - ✅ เลือก “Initialize with a README”
- กด “Create Repository”
Step 2: อัปโหลดไฟล์เว็บ
ถ้าใช้ VS Code หรือ Git:
git clone https://github.com/yourname/my-portfolio
cd my-portfolio
# วางไฟล์ index.html, style.css, รูป ฯลฯ ลงไป
git add .
git commit -m "เพิ่มไฟล์เว็บไซต์"
git push origin main
Step 3: เปิด GitHub Pages
- ไปที่หน้า Repo > คลิกแท็บ Settings
- เลือกเมนูซ้าย: Pages
- ในหัวข้อ Source ให้เลือก
Branch: mainและ/root - กด Save → GitHub จะสร้างลิงก์เว็บให้ภายใน 1 นาที
ลิงก์เว็บไซต์ของคุณจะเป็นแบบนี้:
https://yourname.github.io/my-portfolio
Part 2: Deploy เว็บไซต์ React/Vue/Next.js ด้วย Vercel
Vercel เหมาะกับเว็บที่เขียนด้วย Framework JS เช่น React, Next.js, Vue ฯลฯ
และใช้การ build ก่อนนำขึ้น
Step 1: สมัคร Vercel
- ไปที่ https://vercel.com
- ล็อกอินด้วย GitHub
- กด “New Project” → เลือก Repo ที่ต้องการ deploy
Step 2: ตั้งค่าและ Deploy
- หากใช้ Next.js, Vercel จะตรวจอัตโนมัติ
- หากใช้ React: ต้องมีไฟล์
index.htmlอยู่ในโฟลเดอร์build - เลือก Branch → กด Deploy
- รอไม่กี่วินาที เว็บไซต์ของคุณก็จะออนไลน์แล้ว!
ตัวอย่างลิงก์เว็บจาก Vercel:
https://my-portfolio.vercel.app
ตารางเปรียบเทียบ GitHub Pages vs Vercel
| รายการ | GitHub Pages | Vercel |
|---|---|---|
| เหมาะกับ | เว็บ Static HTML | React, Next.js, Vue |
| ความง่าย | ง่าย (ผ่าน Settings) | ง่ายมาก (ลากวางได้เลย) |
| รองรับ custom domain | ได้ | ได้ |
| ความเร็ว CDN | ดี | ดีเยี่ยม |
| รองรับ Build | ไม่ | ได้ (เช่น npm run build) |
| ฟรีตลอดชีพ | ใช่ | ใช่ (มีแผน Pro เพิ่มฟีเจอร์) |
สรุป
| ถ้าคุณ… | ควรใช้ |
|---|---|
| มีแค่ HTML/CSS/JS | GitHub Pages |
| ใช้ React / Vue / Next.js | Vercel |
| ต้องการ build แล้ว deploy อัตโนมัติ | Vercel |
| ชอบใช้ GitHub อยู่แล้ว | GitHub Pages |
| อยากให้เว็บออนไลน์ภายใน 1 นาที | Vercel |