📌 วันนี้พามาสร้าง Web App ด้วย Google Apps Script
เชื่อมฐานข้อมูลกับ Google Sheets แบบง่าย ๆ
🎯 โพสต์นี้จะช่วยให้คุณ
สร้างระบบใช้งานจริงได้ฟรี
มีฐานข้อมูลเก็บข้อมูลลูกค้า / ฟอร์ม
เหมาะกับสาย No-Code / Low-Code
💡 Detail / Insight
Google Apps Script คือ JavaScript บน Cloud ที่เอามาทำ Web App ได้ 👇
🌐 สร้างหน้าเว็บ (HTML + CSS + JS)
📊 เชื่อม Google Sheets เป็น Database
🔄 รับ-ส่งข้อมูลแบบ Real-time
🔐 ใช้งานผ่านลิงก์ (Deploy ได้ทันที)
ตัวอย่างที่ทำได้
ฟอร์มลงทะเบียน
ระบบบันทึกข้อมูล
Dashboard ง่าย ๆ
🧪 สร้างฟอร์มสมัครงาน
👉 คนกรอกข้อมูลหน้าเว็บ
👉 ข้อมูลไปโผล่ใน Google Sheets อัตโนมัติ 📥
⚙️ How to
เริ่มทำแบบสั้น ๆ
สร้าง Google Sheets (เตรียมคอลัมน์)
เปิด Apps Script
เขียน Code รับข้อมูลจากฟอร์ม
เชื่อม Script → Sheets
Deploy เป็น Web App
แชร์ลิงก์ให้คนใช้งาน 🚀
🚀 ใครอยากมีระบบของตัวเองแบบ “ฟรี + เท่” 🔥
อันนี้คือจุดเริ่มต้นที่โคตรดี
คอมเมนต์ 👇
อยากให้สอนทำ Web App ตัวไหนต่อ?
#GoogleAppsScript #GoogleSheets #WebApp #NoCode
ถ้าคุณกำลังหาแนวทาง “ทำ web app เอง” แบบไม่ต้องตั้งเซิร์ฟเวอร์ ไม่ต้องทำฐานข้อมูลให้ปวดหัว วิธีที่ผมชอบมากคือทำ Web App ด้วย Google Apps Script แล้วใช้ Google Sheets เป็น Database ครับ เหมาะกับงานที่ต้องเก็บข้อมูลไว ๆ เช่น ฟอร์มสมัครงาน, รับออเดอร์, บันทึกลูกค้า, หรือทำ Dashboard ดูสรุปข้อมูล
สิ่งที่ควรรู้ก่อนเริ่ม (เพื่อให้ทำได้ลื่น)
1) ออกแบบตารางใน Google Sheets ให้คิดเหมือนฐานข้อมูล: แถวแรกเป็นหัวคอลัมน์ เช่น timestamp, name, phone, email, position, note และเผื่อคอลัมน์สถานะ เช่น status (new/in progress/done) ไว้ตั้งแต่แรก จะช่วยต่อยอดทำหน้า “จัดการรายการ” ได้ง่าย
2) วางโครงหน้า Web App ให้รองรับมือถือด้วย: ตอนผมทำครั้งแรก ถ้าไม่ตั้ง CSS ให้ responsive เวลาเปิดในมือถือจะเละนิดหน่อย แนะนำให้ใช้ layout แบบคอลัมน์เดียว, ปุ่มใหญ่, ช่องกรอกไม่ชิดกันเกินไป แล้วค่อยเสริมเป็น Dashboard สวย ๆ ทีหลัง
3) แยก 3 ส่วนให้ชัด: UI (หน้าเว็บ), Logic (ตรวจสอบ/จัดรูปข้อมูล), และ Data (อ่าน-เขียน Sheets) พอแยกเป็นส่วน ๆ เวลาแก้จะไม่งง และลดบั๊กเรื่องข้อมูลเข้าคอลัมน์ผิด
โฟลว์ที่ผมใช้บ่อยสำหรับ “สร้าง web app google sheet”
- หน้าเว็บมีฟอร์ม (HTML/JS) รับข้อมูลจากผู้ใช้
- ฝั่ง Apps Script รับค่าจากฟอร์ม แล้วทำ validation เช่น บังคับกรอก, เช็กอีเมล, ตัดช่องว่าง
- เขียนลง Google Sheets พร้อมเวลา (timestamp)
- ส่งผลกลับไปหน้าเว็บให้ผู้ใช้เห็นว่า “ส่งสำเร็จ” หรือ “ข้อมูลไม่ครบ”
ทิปเรื่องความปลอดภัยและการ Deploy (หลายคนพลาดตรงนี้)
- ตอน Deploy เป็น Web App ให้เลือกสิทธิ์ให้เหมาะกับงาน: ถ้าเป็นฟอร์มสาธารณะทั่วไป อาจตั้งให้ “Anyone” เข้าถึงได้ แต่ระวังโดนสแปม ควรมีการตรวจสอบขั้นต่ำ เช่น จำกัดจำนวนครั้ง/เช็ก format
- ถ้าเป็นระบบใช้ในทีม แนะนำให้จำกัดเฉพาะในโดเมน/เฉพาะผู้ใช้ที่มีสิทธิ์ แล้วทำหน้า login ผ่าน Google ได้จะปลอดภัยกว่า
ไอเดียเพิ่มคลิกและความ “ใช้งานจริง” ของเว็บแอป
- ทำหน้า “รายการข้อมูล” แบบตารางให้ HR/แอดมินเปิดดูได้ทันที
- ใส่ปุ่มเปลี่ยนสถานะ (เช่น ผ่าน/ไม่ผ่าน/รอติดต่อ) แล้วอัปเดตกลับไปที่ Sheets
- ทำ Dashboard สรุปจำนวนผู้สมัครรายวัน/ตำแหน่งยอดนิยม โดยอ่านจาก Sheets แล้วแสดงเป็นการ์ด/กราฟง่าย ๆ
สรุป: ถ้าเป้าคือ “สร้างเว็บแอปพลิเคชัน” แบบฟรี เร็ว และดูทันสมัย Google Apps Script + Google Sheets คือจุดเริ่มที่คุ้มมาก ทำได้ตั้งแต่ฟอร์มพื้นฐานไปจนถึงระบบหลังบ้านเล็ก ๆ ใช้ได้ทุกอุปกรณ์ และทุกอย่างอยู่บน Google Cloud จัดการง่ายครับ
สำหรับ แบบฟรี จำกัดจำนวน ผู้เข้าใช้แอพ เหมือน AppSheet ไหมครับ