วันพุธที่ 18 มกราคม พ.ศ. 2560

CSV Program.


หน้าต่างเว็บตอนเริ่มต้น


เริ่มแรกมา Default จะตั้งอยู่ที่ None เสมอ


กดเลือกเราที่วันเกิด และกดปุ่ม Submit


วันที่เราเพิ่มเข้าไปจะเพิ่มเลขขึ้นมา


ภายในไฟล์ CSV ตอนเริ่มต้น จะเห็นว่า มีแถวของ Day และ Number


หากมีการเลือกวัน ภายในไฟล์ CSV ก็จะเปลี่ยนแปลงเช่นกัน


ต่อไปจะเป็นการอธิบายในส่วนของโค้ด

เริ่มแรกจะประกาศตัวแปร day ให้รับค่าวันต่างๆมาก่อน จากนั้นสร้างอาเรย์ data ขึ้นมาไว้เก็บจำนวนคนเกิดในแต่ละวัน ส่วนของการอ่านและเพิ่มจำนวนคนเกิดในแค่ละวันนั้น ใช้เป็น for loop และเงื่อนไข if ว่า ถ้าในแถววัน ตรงกับ วันใดๆ ให้เพิ่มเลขในแถวจำนวนขึ้นไป 1 ถ้าแต่ไม่ใช่ ก็ให้เลขเท่าเดิม


โดยในส่วนของการ Read CSV ได้แรงบันดาลใจมาจากภาพข้างต้น


ส่วนของการ Write CSV นั้น ตอนแรกได้ใช้ for loop เช่นเดียวกับ Read แต่มี Error เกิดขึ้น โดยยังไม่สามารถแก้ไขได้ เลยใช้แบบ Manual ไปก่อน โดยการกำหนดวันแต่ละวันไปเลยว่า ตรงกับ data ตำแหน่งที่เท่าใด (data คืออาเรย์เก็บเลขจำนวนคนเกิดในแต่ละวัน ตามที่ได้บอกข้างต้น)


โดยในส่วนของการ Write CSV ได้แรงบันดาลใจมาจากภาพข้างต้น


ในส่วนสุดท้ายนี้เป็นส่วนที่นำวันต่างๆ มาให้เลือกโดยใช้ select ซึ่งเป็นการเลือกแบบ dropdown คือคลิกเป็นแถวยาวๆ ลงมา ดังในตัวอย่างด้านบน ส่วนด้านหลังของ print คือแสดงข้อมูลออกมาเป็นแบบ text ว่าวันไหน มีจำนวนคนเกิดกี่คน

ที่มาของเว็บที่เป็นแรงบันดาลใจ: https://docs.python.org/2/library/csv.html










วันอาทิตย์ที่ 15 มกราคม พ.ศ. 2560

รวบรวมเว็บที่อธิบายถึง CGI , Static and Dynamic web.

http://ideaserver.com/faqs/faq-website-design-and-development/7-difference-web-static-and-dynamic.html

http://www.genstyles.com/tips-4.html

http://www.siaminterhost.com/kb/index.php?mod_id=2&id=57

CGI Program.


ก่อนหน้านี้เราจะใช้คำสั่งนี้ในเทอมินอล เพื่อทำให้คอมของเราเป็นเซิร์ฟเวอร์ แต่หากจะรันโปรแกรมที่เป็น CGI แล้ว คำสั่งจะเปลี่ยนจาก Simple เป็น CGI แทน


นี่คือหน้าตาเริ่มต้นของ CGI Program เป็นโปรแกรมที่ใช้กรอกประวัติส่วนตัว ได้แรงบันดาลใจมาจากโปรแกรมสมุดเยี่ยมอย่างง่าย

จากนั้นกรอกประวัติส่วนตัวของเราลงไปตามช่องที่มีมาให้ ดังรูป

จากนั้นเมื่อเรากด Submit ประวัติของเราทั้งหมดจะปรากฎขึ้นมา


ต่อไปจะเป็นการอธิบายในส่วนของโค้ด


สิ่งที่ต่างจาก static web คือ เราจะใส่ที่อยู่ของไฟล์ลงไปภายใต้คำสั่ง action และกำหนดวิธีการ ในที่นี้คือ method = get สามารถอ่านคำอธิบายเพิ่มเติมได้ที่ http://www.doesystem.com/e485383a8e0cb4d41012a50663020cd9/%E0%B8%A3%E0%B8%B1%E0%B8%9A%E0%B8%82%E0%B9%89%E0%B8%AD%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%88%E0%B8%B2%E0%B8%81-Form-%E0%B9%81%E0%B8%9A%E0%B8%9A-GET-%E0%B8%81%E0%B8%B1%E0%B8%9A-%E0%B9%81%E0%B8%9A%E0%B8%9A-POST.htm

จากนั้นก็กำหนดช่องต่างๆ โดยคำสั่งที่ทำให้เป็นช่องๆคือ input type = text กำหนดชนิดของ input ว่าเป็น text จากนั้นกำหนดปุ่ม sumbit ให้เป็นชนิด sumbit ส่วนด้านล่างคือการกำหนดรูปแบบ ให้แสดงคำว่า Hello ตามด้วยชื่อสกุล Age ตามด้วยอายุ Weight ตามด้วยน้ำหนัก Height ตามด้วยส่วนสูง เป็นอันเสร็จ



วันพุธที่ 11 มกราคม พ.ศ. 2560

การฝึกพิมสัมพัส Type Racing.


ครั้งที่ 1


ครั้งที่ 2


ครั้งที่ 3

เฉลี่ย 30.0 wpm



การเขียน HTML เรื่อง My Idol.



นี่คือหน้าตาของเว็บเพจทั้งหมด ต่อไปจะเป็นการอธิบายในส่วนของโค้ด



โค้ดทั้งหมดมีดังนี้ จะอธิบายแบบแยกเป็นส่วนๆไปว่า ส่วนไหนคือโค้ดตรงไหน

ตามรูปแบบของการเขียน HTML แล้ว โค้ดเริ่มต้น จะต้องเป็นแบบนี้เสมอ

<!DOCTYPE html>
<html>
<head>
<title>ชื่อตรงนี้จะปรากฎอยู่ตรงแท็บด้านบนของเบราวเซอร์</title>
</head>
<body>

<h1>ส่วนนี้คือหัวข้อ จะกลายเป็นตัวหนาและมีขนาดใหญ่</h1>
<p>ส่วนนี้จะเป็นเนื้อหา ตัวอักษรมีขนาดปกติ</p>

</body>
</html>


ดังที่เห็นในรูป เมื่อใส่ข้อความเข้าไปในส่วนของ title ข้อความส่วนนั้น จะปรากฎอยู่ตรงแท็บของเบราวเซอร์


จะเห็นว่า ข้อความที่อยู่ในส่วนของ <h1> จะเป็นตัวหนา และมีขนาดใหญ่ เพราะเป็นส่วนของหัวข้อนั่นเอง ส่วน <center> นั้น ทำให้ข้อความอยู่ตรงกึ่งกลาง และ </br> ทำให้ข้อความขึ้นบรรทัดใหม่


โดยเริ่มแรกนั้น เมื่อใส่ข้อความเป็นภาษาไทยลงไป เว็บจะไม่สามารถอ่านได้ จะได้ใส่โค้ดที่ช่วยให้เว็บสามารถอ่านฟอนต์ไทย ดังในภาพ


โค้ดส่วนนี้จะเป็นการกำหนดสีของพื้นหลัง จากโค้ดใส่คำว่า pink คือบ่งบอกว่าให้พื้นหลังเป็นสีชมพู




โค้ดส่วนนี้จะใช้ใส่รูปภาพต่างๆบนเว็บได้ โดยสามารถกำหนดขนาดได้ตามอัธยาศัย แต่ไฟล์รูปนั้นต้องอยู่ที่เดียวกับไฟล์ HTML และชื่อเดียวกัน รูปจึงจะปรากฎ



จากภาพจะเห็นว่า โค้ดที่อยู่ในส่วนของ <p> จะมีขนาดปกติ ซึ่งเป็นส่วนของเนื้อหา




โค้ดส่วนนี้จะสามารถแปะลิงค์ได้ เมื่อใส่ url เข้าไปแล้ว ลิงค์จะกลายเป็นสีฟ้า สามารถคลิกและเชื่อมต่อไปยังเว็บนั้นๆได้เลย หากคลิกไปแล้ว ลิงค์จะกลายเป็นสีม่วง ดังภาพ


จะเห็นว่าข้อความที่อยู่ในส่วนของ <b> จะกลายเป็นตัวหนา



จะเห็นว่าข้อความในส่วนนี้ มีการย่อหน้า โค้ดที่ใช้ในการย่อหน้าคือ <dd> โดยข้อความที่อยู่หลัง </dd> จะกลับมาขึ้นบรรทัดใหม่แบบปกติ












Link Video Presentation Resort Managemant System Project.

Video Presentation Resort Managemant System Project. จัดทำโดย พากษ์เสียง: คุณาสิน  ทองมณี  5801012620011 ลำดับภาพ: สุพิชชา  ศรีศิริ...