เรียนภาษา Python ด้วยเกม Code Combat - Part 3
สวัสดีครับ มาต่อกันที่ Part 3 วันนี้จะเป็นการตะลุย Web Development และ Game Development โดยทั้ง 2 ด่าน เป็นเหมือน คลาสเรียนมากกว่า มีการแก้โจทย์ปัญหานิดหน่อย ผมก็เลยไม่ปิด Code เพราะคิดว่า นำมาเป็นเนื้อหาในการสอน และอธิบายเพิ่มเติมได้
คลิปวิดีโอ
Web Development
ด่านนี้ เป็นเหมือนการแนะนำการเขียนเว็บเบื้องต้น เพื่อให้เข้าใจ Basic เข้าใจ HTML สามารถนำไปต่อยอดได้ แต่ถ้าจะทำเว็บไซต์จริงๆ ก็ต้องหัดใช้พวก Text Editor / IDE การเปิดไฟล์ เซฟไฟล์และการเช่า Hosting เป็นต้น
แต่เบื้องต้น แนะนำ Basic HTML ผมก็ว่าพอมองเห็นภาพ พอเข้าใจว่าหน้าเว็บประกอบไปด้วยอะไรบ้าง
การขึ้นบรรทัดใหม่ใช้ <br>
Hello World
<br>
This is second line.
การสร้าง paragraph จะใช้ tag <p>
<p>This is paragraph</p>
ตัวอย่างการสร้าง Heading ตั้งแต่ 1-6
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
การแสดงรูปภาพ
<img src="path/to/image.png" alt="Image" >
ได้รู้จักกับ Attributes เช่น src
width
และ height
การแสดงข้อมูลแบบ List ทั้ง <ol>
และ <li>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<ol>
<li>item 1</li>
<li>item 2</li>
</ol>
แท็กอื่นๆ เช่น <div>
<div>
<h1>Heading</h1>
<p>Hello</p>
</p>
CSS เบื้องต้น
<style>
#main {
color: orange;
}
</style>
การกำหนด id
และ class
ให้กับ Element เพื่อให้เราสามารถ ตั้ง selector
ใน CSS ได้
หากอยากเรียนรู้ HTML, CSS เพิ่มเติม ลองอ่านบทความนี้ที่ผมเคยเขียนไว้ครับ
Game Development
เป็นการสอนให้เราเป็นคนสร้างเกม และก็อธิบายว่า การออกแบบเกม ต้องทำยังไงบ้าง
- ต้องสร้าง Hero (spawn) และเลือกตำแหน่งจุดเกิด
- ต้องกำหนด Goal ที่จะชนะ เช่น กำจัดศัตรูให้หมด หรือ อยู่รอด x วินาที
- สามารถ spawn ศัตรูออกมา ที่ตำแหน่ง x, y ที่ต้องการได้
- เลือกชนิดศัตรูได้
- เลือกสิ่งของที่จะ spawn ก็ได้ เช่น รั้วไม้, ป่า เป็นต้น
ส่วนนี้ ก็จะไม่มีอะไรมาก เน้นไปที่ความคิดสร้างสรรค์มากกว่า ไม่มีข้อกำหนดตายตัว ว่าแบบนี้ผ่าน แบบนี้ไม่ผ่าน เราสามารถออกแบบได้ตามที่เราต้องการ
จบไปแล้วครับ สำหรับ Part 3 วันนี้ ก็เน้นไปที่การเรียน รอ Part 4 จะเคลียร์ Game Development ให้จบ แล้วก็จะไปด่านใหม่ แล้วครับ
Happy Coding ❤️
ตอนอื่นๆ


