คลังโค้ดครู DevTech

ระบบบันทึกข้อมูลย้ายเข้า-ย้ายออกนักเรียน

ระบบบันทึกนักเรียนย้ายเข้า-ย้ายออก สามารถนำไปแก้ไขได้ ✅ มี Dashboard แสดงข้อมูล ✅ มีหน้า Login เข้าสู่ระบบ ระบบหลังบ้าน ✅ Export เป็น Excel และ PDF แต่ติดที่ PDF ไม่เป็นภาษาไทย ✅ เพิ่ม/แก้ไข/ลบข้อมูลได้จาก admin ✅ บันทึกลง Google Sheets ✅ เพิ่มปีการศึกษาได้ ผู้ดูแลระบบ Username : admin Password : 123456

ระบบบันทึกข้อมูล Home Health Care

ระบบบันทึกข้อมูลผู้ป่วย Home Health Care ⸻ 💻 ระบบนี้ถูกออกแบบเป็น Web Application โดยใช้ Google Apps Script ทำงานร่วมกับหน้าเว็บ (Canvas) ซึ่งเป็นส่วนของ Frontend UI ที่ผู้ใช้งานต้องกรอกข้อมูล โดยมีภาพรวมการทำงานดังนี้ค่ะ 🖥️ ส่วนแสดงผล (UI & Design) • ออกแบบด้วย Tailwind CSS รองรับทุกอุปกรณ์ (Responsive) ทั้งมือถือและคอม • ใช้ FontAwesome เพิ่มความสวยงามด้วยไอคอน • มีฟอร์มกรอกข้อมูลครบ เช่น วันที่, ชื่อพยาบาล, ชื่อผู้ป่วย, สัญญาณชีพ (ความดัน, อุณหภูมิ, ชีพจร, ออกซิเจน) และรายละเอียดการดูแล ⚙️ ส่วนเตรียมพร้อมก่อนใช้งาน (Initialization) • เปิดหน้าเว็บมา ระบบตั้งค่า “วันที่” เป็นวันปัจจุบันให้อัตโนมัติ • มีระบบ Mock google.script.run สำหรับทดลองกดปุ่มในหน้า Preview (ใช้ทดสอบได้แม้ยังไม่เชื่อม GAS จริง) 📥 เมื่อกดปุ่ม “บันทึกข้อมูล” • เรียกฟังก์ชัน submitForm(event) • ป้องกันการรีเฟรชหน้าเว็บ • เปลี่ยนปุ่มเป็น “กำลังโหลด…” และกันการกดซ้ำ • รวมข้อมูลทั้งหมดในฟอร์มเป็น Object เดียว 🔗 การเชื่อมต่อกับ Backend (Google Apps Script) • ส่งข้อมูลไปยัง code.gs ด้วย google.script.run.saveData(dataObject) ✅ กรณีบันทึกสำเร็จ • แจ้งเตือนด้วย SweetAlert2 ว่า “บันทึกสำเร็จ” • ล้างฟอร์ม และตั้งค่าวันที่เป็นวันนี้อัตโนมัติ ❌ กรณีเกิดข้อผิดพลาด • แจ้งเตือน Error ด้วย Pop-up สีแดง • เปิดให้กดบันทึกใหม่ได้ทันที ⸻ 🎯 สรุปการทำงานของระบบนี้ รับข้อมูล ➝ จัดรูปแบบ ➝ ส่งเข้า Google Sheet ➝ แจ้งผลผู้ใช้งาน

ระบบบันทึกชั่วโมงพัฒนาวิชาชีพครู

ระบบบันทึกชั่วโมงวิชาชีพครู (PD) พร้อมใช้งานกับ Google Sheets ทันที 🚀 ใครกำลังทำแฟ้มสะสมงาน / เตรียมประเมิน วPA / สรุปชั่วโมงพัฒนาตนเอง ระบบนี้ช่วยให้ “เลิกปวดหัวกับการรวมชั่วโมง” ได้เลยค่ะ ⸻ 🔹 ระบบนี้ทำอะไรได้บ้าง? เป็นเว็บแอปพลิเคชันสำหรับบันทึกและสรุปชั่วโมงพัฒนาวิชาชีพครู (PD) ทำงานร่วมกับ Google Sheets ผ่าน Google Apps Script ใช้งานฟรี ไม่ต้องเช่าโฮสต์ ❗ แบ่งการทำงานเป็น 2 แท็บหลัก ⸻ ✍️ แท็บที่ 1: บันทึกชั่วโมง ✅ กรอกข้อมูลได้ครบ • รหัสครู • ชื่อ-นามสกุล • ชื่อกิจกรรม/หลักสูตร • วันที่เข้าร่วม • จำนวนชั่วโมง ✅ ป้องกันการกดซ้ำ เมื่อกด “บันทึกข้อมูล” ปุ่มจะขึ้นสถานะ Loading ทันที ✅ แจ้งเตือนสวยงามด้วย SweetAlert2 บันทึกสำเร็จ / เกิดข้อผิดพลาด มีป๊อปอัปแจ้งชัดเจน ✅ ส่งข้อมูลเข้า Google Sheets อัตโนมัติ ผ่านคำสั่ง google.script.run.saveData() ⸻ 📊 แท็บที่ 2: สรุปชั่วโมงรวม 🏆 แสดงตารางจัดอันดับ (Leaderboard) • อันดับ • รหัสครู • ชื่อ • จำนวนครั้งที่เข้าร่วม • ชั่วโมงรวมทั้งหมด 🥇🥈🥉 ไฮไลต์ 3 อันดับแรก ตกแต่งพิเศษพร้อมไอคอนเหรียญทอง เงิน ทองแดง 🔄 มีปุ่มรีเฟรช อัปเดตข้อมูลทันที ไม่ต้องโหลดหน้าใหม่ ดึงข้อมูลผ่าน google.script.run.getSummaryData() แบบเรียลไทม์ ⸻ 💻 เทคโนโลยีที่ใช้ ✔ Bootstrap 5 — ดีไซน์ทันสมัย Responsive ทุกอุปกรณ์ ✔ ฟอนต์ Sarabun จาก Google Fonts — อ่านง่าย เป็นทางการ ✔ Google Apps Script + Google Sheets — ฟรี 100% ⸻ 🎯 เหมาะสำหรับ • โรงเรียนที่อยากเก็บชั่วโมง PD แบบเป็นระบบ • กลุ่มครูที่ต้องสรุปชั่วโมงประจำปี • งานประเมิน วPA • ผู้บริหารที่ต้องการดูภาพรวมแบบเรียลไทม์

ระบบบันทึกผลซ่อมเสริม

ระบบบันทึกผลซ่อมเสริม 📋 สรุปภาพรวมการทำงาน เปลี่ยนการจดกระดาษแบบเดิม ๆ ให้เป็นระบบออนไลน์ที่กรอกง่าย บันทึกไว และดูข้อมูลได้ทันทีผ่าน Google Sheets ครูกรอกข้อมูลผ่านมือถือหรือคอมพิวเตอร์ ข้อมูลวิ่งเข้า Sheet อัตโนมัติ พร้อมใช้งานจริงในโรงเรียน 🔹 องค์ประกอบหลักของระบบ (The 3 Pillars) 🟢 Frontend – หน้าเว็บฟอร์ม (index.html) • สำหรับครูผู้สอนกรอกข้อมูล เช่น รหัสนักเรียน ชื่อ คะแนน และผลการประเมิน • ออกแบบด้วย Tailwind CSS รองรับมือถือเต็มรูปแบบ • ส่งข้อมูลไปหลังบ้านด้วย google.script.run • แจ้งเตือนผลการบันทึกแบบ Popup ทันที 🔵 Backend – สมองของระบบ (Code.gs) • doGet(): เรียกหน้าเว็บให้ใช้งานผ่านลิงก์ • saveRemedialData(): รับข้อมูล สร้าง TimeStamp และบันทึกลง Sheet • setup(): ฟังก์ชันขอสิทธิ์ระบบ ป้องกันปัญหาหน้าจอขาวก่อน Deploy 🟢 Database – Google Sheets • เก็บข้อมูลต่อเนื่องแบบเรียลไทม์ • สร้างหัวตารางให้อัตโนมัติครั้งแรก • ผู้บริหารเปิดดูผลได้ทันที ไม่ต้องรอรายงาน 🔹 ขั้นตอนการทำงาน (Data Flow) 1. ครูเปิดลิงก์ Web App → กรอกข้อมูล → กดบันทึก 2. ระบบล็อกปุ่มกันกดซ้ำ และส่งข้อมูลไป Backend 3. Code.gs ประมวลผล → ตรวจหัวตาราง → เชื่อม Sheet 4. บันทึกข้อมูลต่อท้ายอัตโนมัติ 5. แจ้งผล Success พร้อม Popup สีเขียว และล้างฟอร์มทันที 🔹 ปัญหาที่พบและการแก้ไข ⚠️ White Screen จากการบล็อกหน้าต่างขอสิทธิ์ของ Browser ✔️ แก้ด้วยการรันฟังก์ชัน setup() ใน Apps Script Editor เพื่อ Authorize ก่อน Deploy ทำให้ใช้งานได้สมบูรณ์ ✅ จุดเด่นของระบบ • Real-time ผู้บริหารติดตามผลได้ทันที • ลดการใช้กระดาษและงานเอกสาร • ใช้งานได้ทุกที่ แค่มีอินเทอร์เน็ต • เหมาะกับโรงเรียนที่ต้องการระบบง่าย แต่ใช้ได้จริง ระบบเล็ก ๆ แต่ช่วยลดงานครูได้มหาศาล และต่อยอดพัฒนาเป็นระบบติดตามนักเรียนแบบเต็มรูปแบบได้ในอนาคต 🚀

ระบบเบิกวัสดุสำนักงานออนไลน์

ระบบเบิกวัสดุสำนักงานออนไลน์ 📦✨ ใครกำลังมองหาระบบเบิกของในองค์กร/โรงเรียน แบบใช้งานได้จริง ตัวนี้ตอบโจทย์มากค่ะ 👍 วันนี้ขอสรุปภาพรวมการทำงานให้เข้าใจง่ายๆ ว่าระบบนี้ทำงานยังไง 👇 💡 ระบบนี้ออกแบบเป็น 3 ส่วนหลัก (3-Tier Architecture) 📊 1. ฐานข้อมูล (Google Sheets) เป็นเหมือนที่เก็บข้อมูลทั้งหมด แบ่งเป็น - Requests → เก็บประวัติการเบิกทั้งหมด - Settings → เก็บรายการวัสดุที่ให้เบิก ⚙️ 2. ระบบหลังบ้าน (Google Apps Script) ทำหน้าที่เป็น “สมอง” ของระบบ - รับคำสั่งจากหน้าเว็บ - ดึง/บันทึกข้อมูลลงชีต - จัดการสถานะคำขอ (อนุมัติ/ปฏิเสธ) 💻 3. หน้าจอผู้ใช้งาน (Frontend HTML) 👨‍💼 ฝั่งพนักงาน - เลือกรายการวัสดุ (ดึงจากระบบอัตโนมัติ) - กรอกข้อมูล + ส่งคำขอ - ระบบสร้างรหัสคำขอ + บันทึกทันที - มีแจ้งเตือนสวยงาม ใช้งานง่าย 🛠️ ฝั่งแอดมิน - ดูคำขอทั้งหมดแบบตาราง - กรองเฉพาะ “รออนุมัติ” - กดอนุมัติ / ปฏิเสธ ได้ทันที - เพิ่มรายการวัสดุใหม่ได้เองแบบ Real-time ✨ จุดเด่นของระบบนี้ ✅ ข้อมูลอัปเดตทันที (Real-time) ✅ ใช้งานง่าย UX ดี มีแจ้งเตือนสวย ✅ แยก User Admin ชัดเจน ✅ ใช้ฟรีบน Google ไม่ต้องมีเซิร์ฟเวอร์ 📌 เหมาะกับ: โรงเรียน / องค์กร / สำนักงาน ที่อยากเลิกใช้กระดาษ การเข้าใช้งานหน้า admin พิมพ์ ?page=admin ต่อท้าย exec

ระบบแบบประเมินความพึงพอใจ

ระบบ "แบบประเมินความพึงพอใจ" ออนไลน์ 🎉 ทำงานด้วย Google Apps Script + Google Sheets ใช้งานง่าย ✨ ✅ ครู / อาจารย์ / หน่วยงาน สามารถนำไปใช้เก็บข้อมูลออนไลน์ได้เลย ✅ เก็บผลลัพธ์ลง Google Sheets อัตโนมัติ ✅ นำไปทำสำเนา (Make a copy) แล้วใช้งานได้ทันที ❌ ไม่อนุญาตให้นำไปขาย หรือใช้ในเชิงพาณิชย์ 📌 ระบบนี้สร้างจากการทดลอง Canva AI + App Script เพื่อช่วยลดเวลาในการทำงาน