วิธีสร้าง To-Do App ใน Google Sheets ง่ายๆใน 3 ขั้นตอน

เมื่อวานแอดมีสอน Google Sheets As A Language บนเพจ เลยมาเขียนสรุปพาร์ทที่ทำ Simple To-Do App ให้อ่านกันเผื่อใครอยากลองทำตามอีกรอบนะครับ

📝 ทุกวันนี้ Google Sheets ไม่ใช่แค่ spreadsheets software แล้ว แต่แอดมองมันเป็นภาษาที่เราใช้สร้าง application ไว้ใช้งานได้ด้วย คล้ายๆ low-code platform เลย 555+

ตัวอย่าง simple to-do app

การสร้าง To-Do App ใน Sheets ทำได้ง่ายๆใน 3 ขั้นตอน add data > add check box > apply conditional formatting หรือจะใช้ drop down list ด้วยไว้สร้าง tag ปิดท้ายด้วยการ mention users ที่ต้องรับผิดชอบ task นั้นๆ

Table of Contents

Design To-Do App

✅ โดยทั่วไปก่อนที่ทีม dev จะเริ่ม build app เราต้องทำ user research/ interview ก่อนว่าเค้าอยากได้อะไรบ้าง มีปัญหาอะไรบ้าง ฟีเจอร์ไหนที่จะมาแก้ปัญหาให้เค้าได้

Requirements สำหรับการสร้างแอปวันนี้คือ

  • มี column list ที่เราต้องทำ (Text)
  • มี checkbox ให้คลิกงานไหนทำเสร็จแล้วบ้าง (Boolean)
  • สามารถใส่วันที่ due date ได้ (Date)
  • สามารถ assign งานนั้นๆให้ member ในทีมเราได้ (Text/ People Chip)

ถ้าเราต้องเขียน code ให้ได้แอปนี้อาจจะใช้เวลา 1-2 ชั่วโมง แต่ถ้าใช้ Google Sheets คือ 10 นาทีเสร็จเลย ทำไมมันง่ายอย่างนี้ 555+ ได้ MVP ไปให้ users ลองใช้งานได้ทันที

MVP = Minimum Viable Product

Eric Ries, Founder of Lean Startup

Add Data

พอ requirements นิ่งแล้ว ก็ได้เวลาเตรียมข้อมูลเพื่อสร้างแอป แอดสร้างไว้สองคอลัมน์

  • Task (Text)
  • Due Date (Date)

📝 ปกติเวลาเราสร้าง database ต้องกำหนด schema ชื่อคอลัมน์และประเภทข้อมูลไว้ด้วย

เตรียมข้อมูลสำหรับ application

Date Format ใน Google Sheets เราแนะนำให้ใช้ pattern YYYY-MM-DD นะครับ sheets จะรู้เลยว่าอันนี้คือ date type เวลา user เอาเม้าส์ไปคลิกจะเห็น calendar view แสดงขึ้นมา

ตัวอย่าง calendar view ใน Google Sheets
Calendar View

OK! ตอนนี้ data เราใช้ได้แล้วครับ step ต่อไปคือการเพิ่มปุ่ม checkbox ให้ user ใช้งาน

Add Checkbox

ใช้เม้าส์ไฮไลท์คอลัมน์ complete แล้วไปที่เมนู Insert > Check Box

เสร็จแล้ว ขั้นตอนนี้ง่ายมาก 555+

เพิ่ม checkbox ในคอลัมน์ complete

Apply Conditional Formatting

มาถึงขั้นตอนที่สำคัญที่สุดในการสร้าง app ตัวนี้เลย เวลา user กดที่ checkbox เราจะ apply format ที่คอลัมน์ task เช่น ขีดฆ่า task นั้นๆ (done)

ใช้เม้าส์คลิกไฮไลท์คอลัมน์ task ไปที่เมนู Format > Conditional Formatting จะมีหน้าต่าง option ทางด้านขวาโผล่ขึ้นมา

คลิกที่ Format cells if … เลือก Custom Formula แล้วพิมพ์ =C4 ตามรูปด้านล่าง (cell บนสุดของคอลัมน์ complete) ปรับ format แบบที่เราต้องการ เสร็จแล้วกด Done

conditional formatting เปลี่ยน format ของคอลัมน์ task
ใช้ conditional formatting เพื่อปรับ format คอลัมน์ task เวลา user คลิก checkbox

Step นี้อธิบายง่ายๆว่า format ของคอลัมน์ task ขึ้นอยู่กับ action ในคอลัมน์ complete เมื่อไหร่ก็ตามที่ user คลิก checkbox (TRUE) ตัว format ที่เราตั้งค่าไว้จะถูก trigger ทันที

Optional – Assign Member

ขั้นตอนสุดท้ายเป็น optional นะครับ

✅ Google Sheets เปิดตัว Smart Chips ในเดือน พ.ย. 2565 ที่ผ่านมา โดยเราสามารถ mention ชื่อ user ในทีมเรา (หรือ email คนที่เราเคยติดต่อ) ใน sheets ได้เลย

นอกจากชื่อ user เรายังสามารถ mention calendar และ file ใน google drive ได้ด้วย แค่พิมพ์ @ ตามด้วย email หรือชื่อ user คนนั้นๆ เช่น @Kasidis Toy

Final To-Do App ใช้เวลาทำไม่ถึง 10 นาที
mention ชื่อเพื่อนของเราที่ต้องทำ task นั้นๆ

ใช้เวลาทำไม่ถึงสิบนาที ตอนนี้เราได้ Simple To-Do App ไว้ใช้งานแล้วครับ Amazing ง่ายจนงง 555+ แอดสรุปสามเทคนิคที่เราใช้ในการสร้างแอปนี้

  • Checkbox
  • Conditional Formatting
  • Smart Chips (@mention)

ที่เหลือคือความคิดสร้างสรรค์ล้วนๆ ลองนำเทคนิคนี้ไปใช้ในงานดูนะครับ วันก่อนแอดเขียนเรื่องการสร้าง Timeline ไว้ด้วย ลองอ่านต่อได้นะครับ ฟีเจอร์ใหม่สุด premium เลย

ถ้าบทความนี้มีประโยชน์ กดแชร์ให้เพื่อนๆได้อ่านด้วยนะครับทุกคน

แอดทอย 💖 Google Sheets

Leave a Reply