หน่วยที่ 1 EP.4: ลุยเขียนโค้ดกับ Code.org
  • By Admin
  • 1
  • 13 เม.ย. 2569

หน่วยที่ 1 EP.4: ลุยเขียนโค้ดกับ Code.org

ได้เวลาลงมือเขียนโปรแกรมของจริง! สวมบทบาทนักพัฒนาเกมตัวน้อย เรียนรู้วิธีการเขียนโปรแกรมแบบบล็อก (Block-based Programming) ผ่านเว็บไซต์ Code.org สนุกไปกับการลากบล็อกคำสั่งสั่งให้น้องหมาพูดทักทาย "สวัสดี" และเคลื่อนที่ไปหาน้องแมว พร้อมรู้จักการหาข้อผิดพลาดของโปรแกรม (Debugging)

💻 หน่วยที่ 1 EP.4: ลุยเขียนโค้ดกับ Code.org

สวมบทบาทนักสร้างเกมตัวน้อย!

หลังจากที่เราวางแผนด้วยผังงาน (Flowchart) กันไปแล้ว คราวนี้เราจะมาเขียนโปรแกรมจริงๆ กันครับ! เราจะใช้เว็บไซต์ระดับโลกที่ชื่อว่า Code.org ซึ่งเป็นการเขียนโปรแกรมแบบ "ลากบล็อกคำสั่งมาต่อกัน (Block-based Programming)" เหมือนการต่อเลโก้เลยครับ ง่ายและสนุกมากๆ!

🌐 1. เข้าสู่โลกของนักเขียนโค้ด

เริ่มต้นด้วยการเปิดเว็บเบราว์เซอร์ พิมพ์ https://code.org แล้วเลือกภาษาไทย จากนั้นคลิกที่เมนู "นักเรียน (Students)" 👉 เลือก "คอร์ส 2" 👉 และคลิกบทเรียน "เพลย์แลป: สร้างเรื่อง" ครับ

🧩 2. ลากบล็อกสั่งน้องหมาพูด "สวัสดี"

เมื่อเข้ามาแล้ว นักเรียนจะเห็นหน้าจอแบ่งเป็น 2 ฝั่ง ซ้ายคือ "เวทีแสดง" (มีน้องหมารออยู่) ขวาคือ "พื้นที่ทำงาน" ครับ

สเต็ปการเขียนโปรแกรม:
  1. คลิกเมาส์ค้างที่บล็อกคำสั่ง พูดว่า "พิมพ์ที่นี่"
  2. ลากมาต่อด้านล่างของบล็อกสีส้มที่ชื่อว่า เมื่อเรียกใช้งาน (When Run)
  3. คลิกเข้าไปแก้คำว่า "พิมพ์ที่นี่" เปลี่ยนเป็นคำว่า "สวัสดี"
  4. กดปุ่ม ▶ เริ่ม (Run) ใต้เวทีแสดงผล น้องหมาก็จะพูดคำว่าสวัสดีออกมาทันที!

🐕🐈 3. สร้างเรื่องราว: น้องหมาเดินไปหาน้องแมว

เราสามารถเพิ่มตัวละคร "น้องแมว" เข้ามาได้ด้วยครับ จากนั้นให้นักเรียนหาบล็อกคำสั่ง ย้าย... ไปทางขวา... ลากมาต่อด้านล่างสุด เพื่อสั่งให้น้องหมาเดินเข้าไปทักทายน้องแมว

💡 รู้หรือไม่? นักเรียนสามารถกำหนดได้ว่าจะให้ตัวละครเดินไปไกลแค่ไหน โดยการเปลี่ยนตัวเลข "พิกเซล (Pixels)" ในบล็อกคำสั่งครับ เช่น เดินไป 25 พิกเซล หรือ 50 พิกเซล

🛠️ 4. โปรแกรมพังทำอย่างไร? (Debugging)

ถ้ากดปุ่ม "เริ่ม" แล้วตัวละครไม่ทำตามที่เราคิด ไม่ต้องตกใจครับ! สิ่งนี้เรียกว่า ข้อผิดพลาด (Bug) หน้าที่ของนักโปรแกรมเมอร์คือต้องค่อยๆ ไล่ดูบล็อกคำสั่งทีละบรรทัดว่าเราต่อผิดตรงไหน แล้วแก้ไขให้ถูกต้อง กระบวนการตามหาและแก้ไขข้อผิดพลาดนี้เรียกว่า "การดีบัก (Debugging)" ครับ!

🧩 มินิควิซ ทบทวนความรู้ EP.4

ทดสอบวิชาโค้ดดิ้งของนักพัฒนาเกมตัวน้อย!

ข้อที่ 1: การเขียนโปรแกรมในเว็บไซต์ Code.org ใช้วิธีการใดในการเขียนโค้ด?

ข้อที่ 2: หากต้องการให้ตัวละครบนหน้าจอพูดทักทายนักเรียน ต้องใช้บล็อกคำสั่งใด?

ข้อที่ 3: เมื่อนักเรียนเขียนโปรแกรมเสร็จแล้วกด "เริ่ม" แต่ตัวละครไม่ยอมเดินไปหาเพื่อน นักเรียนควรทำอย่างไร?


แชร์ :

บทเรียนอื่น ๆ