เคยเจอปัญหานี้ไหมคะ?

"ครูคะ หนูส่งงานหรือยัง?"

"ผมขาดงานไหนบ้างครับ?"

เช้า สาย บ่าย เย็น คำถามเดิมๆ วนไป จนครูแทบไม่มีเวลาตรวจงานจริงๆ จังๆ

หรือบางทีจะประกาศคะแนนหน้าห้อง ก็กลัวเด็กที่คะแนนน้อยจะเสียหน้าและถูกเปรียบเทียบ

วันนี้เลยอยากชวนครูทุกคนมาสร้าง "Web App ตรวจสอบคะแนนและงานค้างส่วนตัว"

ที่ทำเสร็จแล้วชีวิตครูจะสบายขึ้น 300% 

แถมเด็กๆ ยังรู้สึกปลอดภัย
เพราะเช็กเองได้ด้วยรหัสส่วนตัว ไม่ต้องกลัวใครเห็นคะแนนเรา !

/////////////////////////////////////////////////////

เอาข้อมูลที่ครูเนยทำแบบจำลองให้ NotebookLM ช่วยสรุปให้เป็น Video เผื่อคุณครูไม่ได้ว่างอ่าน ก็ฟังแบบสรุปเอาไอเดียก่อนได้ที่นี่เลยค่า 

/////////////////////////////////////////////////////

มาดูวิธีทำ Step by Step แบบจับมือครูทำพร้อมไฟล์ตัวอย่างเลยค่า 

Step 1: เตรียมบ้านหลังแรก "Google Sheets"

ฐานทัพข้อมูล (อ้างอิงจากไฟล์: Inskru Ver. 2026 ระบบติดตามการส่งงาน.xlsx 
https://docs.google.com/spreadsheets/d/1bGB_n0moIplkhV49eTtnQ8siUJdPLYgT0MIK6K1-tEw/edit?usp=sharing )

ก่อนจะไปทำเว็บ เราต้องมีข้อมูลที่ระเบียบจัดก่อนค่ะ

ในไฟล์ Sheet นี้ ครูเนยได้ทำการจำลอง Sheet ตรวจงาน + เชคชื่อ มาจากเอกสารจริงที่ใช้ในชั้นเรียน

โดยมีจุดสำคัญคือ:

คอลัมน์ B (รหัสนักศึกษา): อันนี้คือ "กุญแจ" สำคัญที่เด็กจะใช้กรอกเพื่อดูข้อมูลตัวเองค่ะการเช็กชื่อและงาน

ใช้ระบบ True/False หรือ ✅/❌ แบ่งเป็นรายสัปดาห์ (W1-W14)

สรุปคะแนน: แยกส่วนงานเก็บ กลางภาค และปลายภาคให้ชัดเจน

Tips: ครูสามารถใส่สูตรคำนวณเกรดรอไว้ได้เลย พอเด็กกรอกรหัสปุ๊บ คะแนนที่คำนวณล่าสุดจะเด้งไปที่หน้าเว็บทันที

****** ข้อควรระวัง หากกลัวว่า Google Sheet ต้นฉบับจะรั่วไหลเพราะในเวปจำเป็นต้องกรอก Sheet ID ด้วย ให้สร้าง Sheet ใหม่และมีข้อมูลเท่าที่ต้องการแสดงในหน้าเวปพอค่ะ ไม่ต้องเป็นแบบละเอียดอย่างที่นำมาเป็นตัวอย่าง ******

/////////////////////////////////////////////////////

Step 2: เขียน Code.gs "สมองของระบบ"

(อ้างอิงจากไฟล์: code.gs ก๊อบ Text ไปวางใน Apps Script สามารถ Download PDF ในไฟล์แนบของบทความได้เลยค่ะ)

ไปที่เมนู ส่วนขยาย > Apps Script แล้วก๊อปโค้ดจากไฟล์นี้ไปวางได้เลยค่ะ

จุดที่ต้องแก้: มองหาบรรทัด SpreadsheetApp.openById("...") แล้วเอา ID ของ Google Sheet ของครู (ที่อยู่ระหว่าง /d/ กับ /edit) มา

หน้าที่ของมัน: โค้ดส่วนนี้จะทำหน้าที่คอยไปค้นหาใน Sheet ว่า "รหัสที่เด็กกรอกมาเนี่ย อยู่บรรทัดไหน" แล้วดึงข้อมูลทั้งหมดมาเตรียมแสดงผลค่ะ

/////////////////////////////////////////////////////

Step 3: ปรุงหน้าตา web app ด้วย index.html

(อ้างอิงจากไฟล์: index.html ก๊อบ Text ไปวางใน Apps Script)

เปิดไฟล์ใหม่ใน Apps Script ชื่อ index.html แล้วก๊อปโค้ดนี้ไปวางค่ะ

ความเจ๋ง: ใช้ Bootstrap ทำให้เว็บดูทันสมัย เปิดในมือถือก็ได้
และใส่ SweetAlert2 เวลาเด็กกรอกรหัสแล้วเจอข้อมูล จะมีป๊อปอัปสวยๆ เด้งขึ้นมาบอกว่า "พบข้อมูลเรียบร้อย ! "

จุดที่ครูต้องแก้: เลื่อนลงไปล่างสุดตรงคำว่า ชื่อรายวิชา + ผู้สอน เปลี่ยนเป็นชื่อวิชาเท่ๆ ของครูได้เลยค่ะ

/////////////////////////////////////////////////////

Step 4: เปิดใช้งาน (Deploy) และส่งต่อให้เด็กๆ

กดปุ่ม "การทำให้ใช้งานได้ใหม่" (New Deployment) เลือกเป็น "เว็บแอป" และตั้งค่าให้ "ทุกคน" (Anyone) เข้าถึงได้

ครูจะได้ URL ยาวๆ มาหนึ่งอัน แนะนำให้นำไปสร้างเป็น QR Code แปะไว้ในห้อง หรือฝังไว้ใน Google Sites รวมกับเอกสารการสอนอื่นๆ ได้เลย

/////////////////////////////////////////////////////

Step 5: สร้าง "ศูนย์การเรียนรู้ส่วนตัว" ด้วย Google Sites 🏠

ขั้นตอนนี้คือการนำ Web App ที่เราทำเสร็จแล้ว มาจัดบ้านให้น่าอยู่ค่ะ

เพราะลิงก์ URL จาก Apps Script มันทั้งยาวและจำยาก

เราเลยจะเอามา "ฝัง" ไว้ใน Google Sites ให้เด็กๆ เข้าถึงง่ายในที่เดียว

เหมือนที่เนยลองทำไว้ที่ sites.google.com/view/inskruver2026 ค่ะ

ทำไมต้องใช้ Google Sites? เป็นที่รวมทุกอย่าง:

ไม่ใช่แค่เช็กคะแนน แต่เราสามารถวาง "ปุ่มส่งงาน" ไว้คู่กันได้เลยสวยและเป็นระเบียบ

ใส่รูป ใส่คำอธิบายรายวิชา ให้เด็กๆ รู้สึกว่านี่คือพื้นที่ของพวกเขาจริงๆวิธีการทำง่ายๆ

ฝังระบบเช็กคะแนน:

ในหน้าแก้ไข Google Sites ให้เลือกเมนู "ฝัง" (Embed)

> นำ URL ของ Web App ที่เรา Deploy มาวาง

> ระบบจะดึงหน้าจอกรอกรหัสมาโชว์ในเว็บทันที

สามารถใส่ลิงก์ หรือ Google Form หรือ ที่เก็บงานของครูลงไปวางไว้ข้างๆ หรือ ใต้ระบบเช็กคะแนน

เพื่อให้เด็กๆ "เช็กเสร็จปุ๊บ รู้ว่าขาดงานไหน ก็กดส่งได้ปั๊บ" ไม่ต้องสลับหน้าไปมาให้งง💡

Pro-Tip:

ในหน้า Google Sites นี้ ครูอาจจะเพิ่มส่วน "รวมรวม Tutorial" สั้นๆ หรือ "เกณฑ์การให้คะแนน" ไว้ด้วยก็ได้นะคะ

/////////////////////////////////////////////////////

สรุปท้ายบทความ: เทคโนโลยีที่เข้าใจหัวใจมนุษย์ ❤️

การทำระบบนี้อาจจะใช้เวลาเรียนรู้นิดหน่อยในครั้งแรก แต่ผลลัพธ์ที่ได้มันคุ้มค่ามากค่ะ

ครู : มีเวลาไปโฟกัสการสอนและการเยียวยาจิตใจเด็กๆ มากขึ้น

เด็ก : รู้สึกถึงความเป็นส่วนตัว (Privacy) และ ได้รับพลังในการ "กำกับดูแลตัวเอง" (Self-Regulation)

ที่สำคัญที่สุดคือ "การสร้างความเชื่อใจ" ค่ะ

เมื่อเด็กๆ เห็นว่าข้อมูลตรงและโปร่งใส ความขัดแย้งในห้องเรียนจะลดลง และกลายเป็นความร่วมมือกันระหว่างครูและศิษย์แทน

เพื่อนครูลองนำ Template ไปปรับใช้กันดูนะคะ! ถ้าติดตรงไหน หรืออยากให้ช่วยดูโค้ดส่วนไหน ลองถาม Gemini ได้นะคะ เพราะระบบทั้งหมดเป็นของ Google ดังนั้น Gemini ช่วยได้ค่ะ 
หรือติดปัญหาจริงๆต้องการให้ช่วยดู สามารถคอมเมนต์คุยกันได้เลย ครูเนยยินดีช่วยเต็มที่เพื่อห้องเรียนที่มีความสุขของเราทุกคนค่ะ ❤️