เบื่อ Google Sheet? ลองสร้างระบบด้วย Netlify + Neon + Apps Script (คู่มือสำหรับมือใหม่)

ทำไมคนที่เบื่อ Sheet ควรลอง

หากคุณใช้ Google Sheet เป็นฐานข้อมูลมาสักพัก คงเคยเจอปัญหาที่คล้ายกัน เช่น ไฟล์ช้าลงเมื่อข้อมูลมากขึ้น มีคนแก้หัวคอลัมน์จนสคริปต์พัง หรือหลายคนบันทึกพร้อมกันแล้วข้อมูลทับกัน บทความนี้เสนอทางเลือกที่ยังใช้เครื่องมือ Google ที่คุ้นเคยได้เหมือนเดิม แต่ย้ายที่เก็บข้อมูลไปไว้ในฐานข้อมูลจริง

ระบบที่จะสร้างมี 3 ส่วนหลัก

ตัวอย่างตลอดบทความคือ ระบบลงทะเบียนอบรม ที่รับข้อมูลได้ทั้งจากหน้าเว็บบน Netlify และจาก Google Form โดยทุกทางเข้าเก็บลงฐานข้อมูลเดียวกัน

ทั้งหน้าเว็บและ Google Form เขียนลง Neon ที่เดียว ส่วน Sheets และ Gmail เป็นปลายทางสำหรับรายงานและการแจ้งเตือนเท่านั้น

สิ่งที่ต้องเตรียม

1. บัญชี Google (ส่วนตัวหรือ Google Workspace ขององค์กร)
2. บัญชี Neon สมัครด้วยบัญชี Google หรือ GitHub ได้
3. บัญชี Netlify และ GitHub สำหรับเก็บโค้ดหน้าเว็บ
4. ความรู้พื้นฐาน JavaScript และคำสั่ง SQL เบื้องต้น (SELECT, INSERT)

ค่าใช้จ่ายเริ่มต้นเป็นศูนย์ได้ เนื่องจากทุกบริการมีแพ็กเกจฟรี สำหรับ Neon ข้อมูลเดือนตุลาคม 2026 ระบุว่าแพ็กเกจฟรีได้ 100 โปรเจกต์ พื้นที่เก็บข้อมูลเพิ่มจาก 0.5 GB เป็น 1 GB ต่อโปรเจกต์ (แหล่งที่มา) เงื่อนไขเหล่านี้เปลี่ยนบ่อย ควรตรวจสอบที่ หน้าราคาของ Neon ก่อนใช้งานจริง

ขั้นที่ 1 สร้างฐานข้อมูลบน Neon

ผลลัพธ์ของขั้นนี้คือ connection string หนึ่งบรรทัด ซึ่งทั้ง Netlify และ Apps Script จะใช้ร่วมกัน

1. เข้าสู่ระบบ Neon แล้วสร้างโปรเจกต์ใหม่ ตั้งชื่อเช่น training-register
2. เลือก Region ที่ใกล้ผู้ใช้ที่สุด สำหรับผู้ใช้ในไทยมักเลือกภูมิภาคเอเชีย (เช่น Singapore) หากมีให้เลือก
3. ที่หน้า Project Dashboard กดปุ่ม Connect แล้วคัดลอก connection string ซึ่งมีรูปแบบดังนี้ (เอกสาร Neon)

ข้อควรระวัง: สตริงนี้มีรหัสผ่านฐานข้อมูลอยู่ด้วย ห้ามวางในโค้ดหน้าเว็บ ห้าม commit ขึ้น GitHub และห้ามแชร์ในแชท

หมายเหตุ: ปัจจุบัน Netlify มีฐานข้อมูล Postgres ที่จัดการให้เอง (Netlify Database) ด้วย แต่บทความนี้เลือกสร้างโปรเจกต์บน Neon โดยตรง เพราะต้องใช้ connection string เดียวกันกับ Apps Script ด้วย ส่วนส่วนขยาย Netlify DB รุ่นเดิม (แพ็กเกจ @netlify/neon) ถูกประกาศเลิกใช้แล้ว (แหล่งที่มา) จึงไม่แนะนำสำหรับโปรเจกต์ใหม่

ขั้นที่ 2 สร้างตารางแรก

เปิดเมนู SQL Editor ใน Neon วางคำสั่งด้านล่าง แล้วกด Run ตารางนี้เทียบได้กับชีตหนึ่งแผ่นที่มีการกำหนดชนิดข้อมูลและกฎบังคับทุกคอลัมน์

สิ่งที่ได้เพิ่มจาก Sheet ทันที

1. NOT NULL บังคับไม่ให้เว้นว่าง จึงไม่มีแถวที่ข้อมูลไม่ครบหลุดเข้ามา
2. SERIAL สร้างเลขลำดับให้เอง ไม่ซ้ำแม้หลายคนบันทึกพร้อมกัน
3. created_at บันทึกเวลาให้อัตโนมัติ
4. คอลัมน์ source ใช้แยกว่าข้อมูลมาจากเว็บหรือจาก Google Form

ขั้นที่ 3 เชื่อม Apps Script กับ Neon

Apps Script ส่งคำสั่ง SQL ไปที่ Neon ผ่าน HTTPS ได้โดยตรง โดยใช้ UrlFetchApp ยิงคำขอ POST ไปที่ https://<host>/sql พร้อม header ชื่อ Neon-Connection-String ซึ่งเป็นกลไก SQL over HTTP ที่ไดรเวอร์ serverless ของ Neon ใช้อยู่เบื้องหลัง (ตัวอย่างคำขอ) ข้อสังเกตคือต้องใช้ host แบบไม่มี -pooler (อ้างอิง) และส่งได้ครั้งละหนึ่งคำสั่ง

3.1 เก็บ connection string ให้ปลอดภัย

1. เปิด script.google.com สร้างโปรเจกต์ใหม่
2. ไปที่ Project Settings (ไอคอนฟันเฟือง) → Script Properties → เพิ่ม Property ชื่อ NEON_URL แล้ววาง connection string จากขั้นที่ 1

3.2 ฟังก์ชันกลางสำหรับส่ง SQL

3.3 ทดสอบ

1. เลือกฟังก์ชัน testConnection แล้วกด Run
2. ครั้งแรกระบบจะขอสิทธิ์เชื่อมต่อบริการภายนอก (scope script.external_request) ให้กดอนุญาต (เอกสาร UrlFetch)
3. ดูผลที่ Execution log หากเห็นเวลาของเซิร์ฟเวอร์และแถวทดสอบ แสดงว่าเชื่อมต่อสำเร็จ

หมายเหตุ: ปลายทาง /sql เป็นกลไกภายในของไดรเวอร์ Neon มากกว่า API ที่มีเอกสารแยกโดยเฉพาะ จึงควรใช้ Logger.log ตรวจรูปแบบผลลัพธ์ก่อนเขียนต่อ และหากจะใช้งานจริงในองค์กร แนะนำให้ Apps Script เรียกผ่าน API บน Netlify (ขั้นที่ 4) แทนการเรียกฐานข้อมูลโดยตรง เพื่อไม่ต้องกระจายรหัสผ่านฐานข้อมูลไปหลายที่

ขั้นที่ 4 สร้างหน้าเว็บและ API บน Netlify

หน้าเว็บบน Netlify ห้ามต่อฐานข้อมูลตรงจากเบราว์เซอร์ เพราะจะเปิดเผยรหัสผ่าน จึงต้องให้ Netlify Function ทำหน้าที่เป็นตัวกลาง (API) ซึ่งอ่านรหัสจากตัวแปรสภาพแวดล้อมฝั่งเซิร์ฟเวอร์ (คู่มือ Neon + Netlify Functions)

4.1 โครงสร้างโปรเจกต์

ติดตั้งไดรเวอร์ด้วยคำสั่ง npm install @neondatabase/serverless

4.2 Function: netlify/functions/registrations.mjs

4.3 หน้าเว็บ: index.html (ส่วนสำคัญ)

4.4 Deploy

1. Push โปรเจกต์ขึ้น GitHub (ห้ามมีไฟล์ .env ใน repo)
2. ใน Netlify เลือกสร้างไซต์ใหม่จาก Git แล้วเลือก repo นี้
3. ไปที่การตั้งค่าไซต์ ส่วน Environment variables เพิ่ม DATABASE_URL (connection string) และ API_KEY (ข้อความสุ่มยาว ๆ ที่ตั้งเอง)
4. สั่ง Deploy ใหม่ แล้วทดลองลงทะเบียนจากหน้าเว็บ จากนั้นตรวจใน SQL Editor ของ Neon ว่ามีแถวใหม่เข้ามา

ชื่อเมนูในหน้าจอ Netlify อาจเปลี่ยนตามเวอร์ชัน หากหาไม่พบให้ค้นคำว่า Environment variables ในหน้าตั้งค่าไซต์

ขั้นที่ 5 ต่อยอดกับ Google Forms, Sheets และ Gmail

เมื่อมี neonQuery() แล้ว Apps Script จะเป็นสะพานระหว่างฐานข้อมูลกับบริการ Google ทั้งหมด ตัวอย่างด้านล่างวางต่อในโปรเจกต์เดียวกับขั้นที่ 3

5.1 รับข้อมูลจาก Google Form เข้า Neon และส่งอีเมลยืนยัน

สร้าง Google Form ที่มีคำถามชื่อ "ชื่อ-นามสกุล", "อีเมล", "หน่วยงาน", "หลักสูตร" แล้วเปิด Apps Script จากเมนูของฟอร์ม

ตั้ง Trigger: เมนู Triggers (ไอคอนนาฬิกา) → Add Trigger → เลือกฟังก์ชัน onFormSubmit → Event source: From form → Event type: On form submit

5.2 ใช้ Sheet เป็นหน้ารายงาน ไม่ใช่ที่เก็บข้อมูล

ข้อมูลจริงอยู่ใน Neon ส่วน Sheet ทำหน้าที่แสดงสรุปให้ผู้บริหารดูเท่านั้น หากมีคนแก้ Sheet ข้อมูลหลักก็ไม่เสียหาย

ตั้ง Trigger แบบ Time-driven ให้ exportSummary ทำงานทุกวันหรือทุกชั่วโมงตามต้องการ

5.3 แนวทางต่อยอดอื่น

1. สร้างนัดหมายใน Google Calendar ให้ผู้ลงทะเบียนด้วย CalendarApp
2. สร้างไฟล์ PDF ใบยืนยันจาก Google Docs template แล้วแนบอีเมล
3. ทำหน้าเว็บภายในองค์กรด้วย Apps Script Web App (doGet) ที่ดึงข้อมูลจาก Neon มาแสดง

ข้อควรระวังด้านความปลอดภัยและข้อจำกัด

สรุป: เมื่อไรควรย้ายจาก Sheet

Sheet ยังเหมาะกับงานเล็กที่คนไม่กี่คนดูแล แต่เมื่อข้อมูลโตขึ้นหรือมีหลายช่องทางบันทึกพร้อมกัน การย้ายไปเก็บใน Neon แล้วใช้ Sheet เป็นหน้ารายงานจะคุ้มค่ากว่า

ลำดับที่แนะนำสำหรับมือใหม่: สร้างตารางบน Neon → ทดสอบ testConnection ใน Apps Script → ผูก Google Form → ทำ Sheet สรุป → ค่อยเพิ่มหน้าเว็บบน Netlify

แหล่งอ้างอิง

1. Neon serverless driver
2. Use Neon with Netlify Functions
3. Neon pricing และข่าวการเพิ่มพื้นที่แพ็กเกจฟรี (ต.ค. 2026)
4. Apps Script URL Fetch Service
5. ตัวอย่างคำขอ SQL over HTTP ไปยัง Neon
6. Netlify CLI: ประกาศเลิกใช้ Netlify DB รุ่นเดิม