บทที่-2-1

บทที่ 2 รายละเอยี ดของงานทป่ี ฏบิ ัติงาน 2.1 ความเป็ นมาและความสาคัญของปัญหา เนื่องจากในปัจจุบนั การแจง้ ซ่อมคอมพิวเตอร์ยงั เป็นปัญหาในการส่งจ๊อบและการสรุปการแจง้ ซ่อมในแต่ละวนั อยเู่ พราะจะตอ้ งคียใ์ นไมโครซอฟท์ เอก็ เซล ซ่ึงเป็นการสูญเสียเวลามาก ดงั น้นั จึง ไดพ้ ฒั นาคดิ ออกแบบระบบน้ีข้ึน เพ่ือพฒั นาระบบซ่อมใหม้ ีประสิทธิภาพ และความสะดวกรวดเร็ว ในการรับแจง้ งานซ่อมและ ลดการสูญหายของปัญหาที่แจง้ ซ่อม สามารถดาเนินงานต่อเนื่องโดยที่ ไม่ตอ้ งกลบั ไปรับงานที่โต๊ะและสามารถเก็บรายละเอียดสรุ ปของขอ้ มูลงานซ่อมในแต่ละวนั / เดือน/ปี ซ่ึงส่ิงเหลา่ น้ีคอื จะเกบ็ เป็นเอกสารใบงานของพนกั งานท่ีส่งมาซ่อมซ่ึงจะใชพ้ ้นื ที่ในการเก็บ มากและลดการใชก้ ระดาษอีกดว้ ย 2.2 วัตถปุ ระสงค์ของการปฏบิ ัตงิ าน 2.2.1 เพือ่ พฒั นาระบบแจง้ ซ่อมใหม้ ีประสิทธิภาพ 2.2.2 เพือ่ ความสะดวกรวดเร็วในการรับแจง้ งานซ่อม 2.2.3 ลดการสูญหายของปัญหาที่แจง้ ซ่อม 2.2.4 เพอ่ื เกบ็ รายละเอียดของขอ้ มูลงานซ่อมในแต่ละวนั /เดือน/ปี 2.2.5 เพ่ือรับการแจง้ เตือนจากอีเมลและไลน์ได้ 2.3 งานที่ปฏบิ ัติและได้รับมอบหมาย 2.3.1 เขียนระบบแจง้ ซ่อมสรุปการแจง้ ซ่อมในแต่ละวนั /เดือน/ปี 2.3.3 แกไ้ ขปัญหาเก่ียวกบั คอมพวิ เตอร์และอปุ กรณ์ไอที

9 2.4 แผนผงั ข้นั ตอนการปฏิบัตงิ าน เร่ิม กรอกขอ้ มลู พนกั งาน,ปัญหา ตรวจสอบ ไมผ่ า่ น กรอกขอ้ มูลใหค้ รบถว้ น ขอ้ มูล ผา่ น บนั ทึก จบการทางาน ภาพท่ี 2-1 ผงั งานการแจง้ ซ่อม

10 เร่มิ เขา้ ส่รู ะบบ ฮารด์ แวร์ ใช่ ตรวจสอบปัญหาการ ใช่ ซอฟตแ์ วร์ เดนิ ไปทา แจง้ ซ่อม รีโมท ไม่ ใช่ แกไ้ ขสถานะการแจง้ ซอ่ ม บนั ทึก จบ ภาพท่ี 2-2 ผงั งานการรับซ่อม

11 2.5 ลกั ษณะงานทไี่ ด้รับมอบหมาย 2.5.1 รายละเอียดการปฏิบตั ิงาน มีข้นั ตอนดงั น้ี 1) ศึกษาขอ้ มลู และความตอ้ งการของ User 2) จดั ทาสตอรี่บอร์ด 3) เร่ิมการพฒั นาโปรแกรม 4) ทดสอบโปรแกรมให้ User ดูวา่ ตรงตามความตอ้ งการ 5) นาไปใชง้ าน 2.5.2 กาหนดขอบเขตงาน แบ่งเป็น ดงั น้ี 1) ส่วนท่ีแสดงจานวนสินคา้ ท่ีตอ้ งอนุมตั ิ 2) ส่วนท่ีแสดงสินคา้ ที่อนุมตั ิแลว้ 2.6 แผนการดาเนนิ งาน ตางรางท่ี 2.1 แผนการดาเนินงาน ระยะเวลาในการดาเนินงาน 4 เดือน /2562 พ.ย. ธ.ค. ม.ค. ก.พ. ม.ี ค. ข้นั ตอน/สัปดาห์ 3 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 1.เลือกหวั ขอ้ โปรเจค 2.ศึกษาขอ้ มลู 3.วางแผน ออกแบบ 4.เขยี นโปรแกรม 5.ทดสอบ 6.นาไปใชง้ านและนาเสนอ 7.เขียนรายงาน 1. เลือกหวั ขอ้ โปรเจค และเริ่มศึกษา 2. ศึกษาขอ้ มลู เก่ียวกบั ระบบแจง้ ซ่อม 3. วางแผนโปรเจค และออกแบบ

12 4. วางแผนและออกแบบโปรแกรม พฒั นาระบบดว้ ย PHP 5. ทดสอบตวั ระบบและพฒั นาต่อจนสมบูรณ์ 6. นาระบบท่ีทดสอบแลว้ นามาใชง้ าน และนาเสนอต่อผจู้ ดั การ 7. เขยี นรายงาน รายละเอียดของสหกิจ 2.7 วิธีการดาเนนิ โครงการ SDLC ภาพท่ี 2-3 แผนภาพวงจรการพฒั นาระบบ (SDLC) การวิเคราะห์ระบบ (System Analysis) เป็ น การศึกษา วิเคราะห์ และแยกแยะถึงปัญหาที่ เกิดข้ึนในระบบ พร้อมท้งั เสนอแนวทางเสนอแนวทางแกไ้ ขตามความตอ้ งการของผูใ้ ช้งานและ ความเหมาะ สมต่อสถานะทางการเงินขององคก์ ร การออกแบบระบบ (System Design) คือ การ สร้างแบบพิมพเ์ ขียวของระบบใหม่ตามความตอ้ งการในเอกสารความตอ้ งการระบบ กาหนดสิ่งที่ จาเป็น เช่น อินพุท เอา้ ทพ์ ุท ส่วนต่อประสานผใู้ ช้ และการประมวลผล เพื่อประกนั ความน่าเช่ือถือ ความถกู ตอ้ งแมน่ ยา การบารุงรักษาได้ และความปลอดภยั ของระบบ วงจรการพัฒนาระบบ (System Development Life Cycle : SDLC) คือ กระบวนการทาง ความคิด ใน การพฒั นาระบบสารสนเทศเพื่อแกป้ ัญหาทางธุรกิจและตอบสนองความตอ้ งการของผู้ ใชไ้ ด้ โดยระบบท่ีจะพฒั นาน้นั อาจเริ่มดว้ ยการพฒั นาระบบใหม่เลยหรือนาระบบเดิมท่ีมีอย่แู ลว้ มา ปรับเปลี่ยน ให้ดีย่ิงข้ึน ภายในวงจรน้ีจะแบ่งกระบวนการพฒั นาออกเป็ นระยะ ไดแ้ ก่ ระยะการ วางแผน ระยะการวิเคราะห์ (Analysis Phase) ระยะการออกแบบ (Design Phase) และระยะการ สร้างและพฒั นา (Implementation Phase) โดยแต่ละระยะจะประกอบไปดว้ ยข้นั ตอน (Steps) ต่างๆ

13 แตกต่างกนั ไปตาม Methodology ที่นกั วิเคราะห์นามาใช้ เพ่ือให้เหมาะสมกบั สถานะทางการเงิน และความพร้อมขององค์กรในขณะน้ันข้นั ตอนในวงจรพฒั นาระบบ ช่วยให้นักวิเคราะห์ระบบ สามารถดาเนินการได้อย่างมีแนวทางและเป็ นข้ันตอน ทาให้สามารถควบคุมระยะเวลาและ งบประมาณในการปฏิบตั ิงานของโครงการพฒั นาระบบ ได้ ข้นั ตอนต่างๆ น้ันมีลกั ษณะคลา้ ยกบั การตัดสินใจแก้ปัญหาตามแนวทางวิทยาศาสตร์(Scientific Management) อัน ได้แก่ การค้นหา ปัญหา การคน้ หาแนวทางแกไ้ ขปัญหา การประเมินผลแนวทางแกไ้ ขปัญหาท่ีคน้ พบ เลือกแนวทาง ที่ดีที่สุด และพฒั นาทางเลือกน้ันให้ใช้งานได้ สาหรับวงจรการพัฒนาระบบในหนังสือเล่มน้ี จะแบ่งเป็น 7 ข้นั ตอน ไดแ้ ก่ 1. คน้ หาและเลือกสรรโครงการ (Project Identification and Selection) 2. จดั ต้งั และวางแผนโครงการ (Project Initiating and Planning) 3. วิเคราะหร์ ะบบ (Analysis) 4. ออกแบบเชิงตรรกะ (Logical Design) 5. ออกแบบเชิงกายภาพ (Physical Design) 6. พฒั นาและติดต้งั ระบบ (System Implement) 7. ซ่อมบารุงระบบ (System Maintenance) (ณฐั ชยา แซ่เจา, ออนไลน์) 2.8 เคร่ืองมือท่ีใช้ในการพฒั นา 2.8.1 HTML HTML ยอ่ มาจาก Hypertext Markup Language เป็นภาษาคอมพิวเตอร์รูปแบบหน่ึงที่ มีโครงสร้างการเขียนโดยอาศยั ตวั กากบั (Tag) ควบคุมการแสดงผลขอ้ ความ รูปภาพ หรือวตั ถุ อ่ืน ๆ ผ่านโปรแกรมเบราเซอร์ แต่ละ Tag อาจจะมีส่วนขยาย เรียกว่า Attribute สาหรับระบุ หรือควบคุมการแสดงผลของเว็บได้ด้วย HTML เป็ นภาษาท่ีถูกพฒั นาโดย World Wide Web Consortium (W3C) จากแม่แบบของภาษา SGML (Standard Generalized Markup Language) โดยตดั ความสามารถบางส่วนออกไป เพื่อให้สามารถทาความเขา้ ใจและเรียนรู้ได้ง่าย และด้วย ประเด็นดงั กล่าว ทาใหบ้ ริการ WWW เติบโตขยายตวั อยา่ งกวา้ งขวาง

14 Tag เป็นลกั ษณะเฉพาะของภาษา HTML ใชใ้ นการระบุรูปแบบคาสั่ง หรือการลงรหัส คาสั่ง HTML ภายในเคร่ืองหมาย Less - Than Bracket (<) และ Greater-Than Bracket (>) โดย ที่ Tag HTML แบง่ ได้ 2 ลกั ษณะ คอื 2.8.1.1 Tag เดี่ยว เป็ น Tag ที่ไม่ตอ้ งมีการปิ ดรหัส เช่น <Hr> (Tag กาหนดเส้นคนั่ ), 2.8.1.2 Tag เปิ ด/ปิ ด เป็น Tag ท่ีประกอบดว้ ย Tag เปิ ด และ Tag ปิ ด โดย Tag ปิ ด จะมีเครื่องหมาย Slash (/) นาหน้าคาส่ังใน Tag น้ัน ๆ เช่น <B> …… </B> (Tag กาหนด ตวั หนา), <A Href = URL> จุด Link </a> (Tag กาหนดการเชื่อมโยงขอ้ มูล) เป็นตน้ 2.8.1.3 Tag เปิ ด/ปิ ด บาง Tag ละ Tag ปิ ดได้ เช่น <Tr> (Tag กาหนดแถวตาราง), <Th> (Tag กาหนดคอลมั ภต์ าราง) 2.3.1.4 คาสงั่ ใน Tag เขียนดว้ ยอกั ษรตวั ใหญห่ รือเลก็ กไ็ ด้ เช่น <Body> หรือ <Body> หรือ <Body> 2.8.1.5 โครงสร้างของภาษา HTML การเขียนโฮมเพจด้วยภาษา HTML น้ัน เอกสาร HTML จะประกอบด้วย ส่วนประกอบ 2 ส่วน ดงั น้ี 1) ส่วน Head คือส่วนที่จะเป็ นหัว (Header) ของหน้าเอกสารทว่ั ไป หรือ ส่วนชื่อเรื่อง (Title) ของหนา้ ตา่ งการทางานในระบบ Windows 2) ส่วน Body จะเป็นส่วนเน้ือหาของเอกสารน้นั ๆ ซ่ึงจะประกอบดว้ ย Tag คาสง่ั ในการจดั รูปแบบหรือตกแตง่ เอกสาร HTML 3) คาสั่ง หรือ Tag ที่ใช้ในภาษา HTML ประกอบไปด้วยเคร่ืองหมายนอ้ ย กว่า \"<\" ตามดว้ ย ชื่อคาส่ังและปิ ดทา้ ยดว้ ยเคร่ืองหมายมากกว่า \">\" เป็นส่วนที่ทาหนา้ ที่ตกแต่ง ขอ้ ความเพอื่ การแสดงผลขอ้ มูล โดยทวั่ ไปคาสงั่ ของ HTML ส่วนใหญ่จะอยเู่ ป็นคมู่ ีเพยี งบางคาสั่ง เท่าน้ัน ท่ีมีรูปแบบคาสั่งอยู่เพียงตวั เดียวในแต่ละคาส่ังจะมีคาสั่งเปิ ดและปิ ดคาส่ังปิ ดของแต่ละ คาส่ังจะมีรูปแบบเหมือนคาส่ังเปิ ด เพียงแต่จะเพิ่ม \"/\" (Slash) นาหน้าคาส่ัง ปิ ดให้ดูแตกต่าง เท่าน้นั และในคาสั่งเปิ ดบางคาสั่งอาจมีส่วนขยายอ่ืนผสมอยู่ดว้ ย ในการเขียนคาส่ังภาษา HTML สามารถเขียน ด้วยตวั อกั ษร เล็กหรือใหญ่ ท้งั หมดหรือเขียนคละกันได้ เช่น <HTML> หรือ <HTML> หรือ <HTML> ซ่ึงจะใหผ้ ลเหมือนกนั

15 4) คาสั่ง <HTML> เป็ นคาส่ังเริ่ มต้นในการเขียนโปรแกรมและคาสั่ง </HTML> เป็นการสิ้นสุดโปรแกรม HTML คาสั่งน้ีจะไมแ่ สดงผลในโปรแกรมเวบ็ เบราเซอร์ แต่ ตอ้ งเขียนเพ่ือให้เกิดความเป็ นระบบของงาน และเพ่ือจะให้รู้ว่าเอกสารน้ีเป็ นเอกสารของภาษา HTML ส่วนหวั เรื่องเอกสารเวบ็ (Head Section) 5) Head Section เป็ นส่วนที่ใชอ้ ธิบายเก่ียวกบั ขอ้ มูลเฉพาะของหน้าเว็บ น้ัน ๆ เช่น ช่ือเร่ืองของหนา้ เวบ็ (Title) ช่ือผจู้ ดั ทาเวบ็ (Author) คียเ์ วริ ์ดสาหรับการคน้ หา (Keyword) โดยมี Tag สาคญั คือ ขอ้ ความที่ใชเ้ ป็น Title ไม่ควรพิมพเ์ กิน 64 ตวั อกั ษร ไม่ตอ้ งใส่ลกั ษณะ พิเศษ เช่น ตวั หนา เอียง หรือสี และควรใชภ้ าษาที่มีความหมายครอบคลุมถึงเน้ือหาของเวบ็ เพจ น้นั หรือเป็นคาสาคญั ในการคน้ หา (Keyword) 6) Body Section เป็นส่วนเน้ือหาหลกั ของหนา้ เวบ็ ซ่ึงการแสดงผลจะตอ้ งใช้ Tag จานวนมากข้ึนอยู่กบั ลกั ษณะของขอ้ มูล เช่น ขอ้ ความ, รูปภาพ, เสียง, วีดิโอ หรือไฟล์ต่าง ส่วนเน้ือหาเอกสารเว็บ เป็ นส่วนการทางานหลกั ของหน้าเว็บ ประกอบด้วย Tag มากมายตาม ลกั ษณะของขอ้ มูล ท่ีตอ้ งการนาเสนอ การป้อนคาส่ังในส่วนน้ีไม่มีขอ้ จากดั สามารถป้อนติดกนั หรือ 1 บรรทดั ต่อ 1 คาสัง่ กไ็ ดแ้ ตส่ ่วนใหญ่จะยดึ รูปแบบท่ีอ่านง่าย คือ การทายอ่ หนา้ ในชุดคาส่ัง ที่เกี่ยวขอ้ งกนั ท้งั น้ีใหป้ ้อนคาสง่ั ท้งั หมดภายใต้ Tag <Body> … </Body> (ธานินทร์ คงศิลา, ออนไลน)์ 2.8.2 PHP PHP เป็นชื่อยอ่ ของภาษาโปรแกรมมิ่งชนิดหน่ึงที่มีช่ือว่า “Professional Home Pages” แต่ในปัจจุบนั ภาษาชนิดน้ันถูกพฒั นาต่อมาจนกลายเป็ นภาษาโปรแกรมม่ิงชนิดใหม่ซ่ึงมีชื่อ ว่า “Personal Hypertext Processor ; PHP” ภาษาชนิดใหม่น้ีเป็ นที่นิยมในการนามาใช้เขียนสคริปต์ (ชุดคาสง่ั ควบคุมการทางานของโปรแกรม ซ่ึงมีความยาวไม่มากนักและสามารถทางานได้ดีกับ เว็บไซตเ์ ป็ นอย่างมาก) PHP เป็ นภาษาสคริปตท์ ี่เป็ น Server Side Script และเป็ น Open Source ท่ีผูใ้ ชท้ วั่ ไปสามารถ Download Source Code ไดฟ้ รี จุดประสงคท์ ี่สาคญั ของภาษา PHP คือการ ช่วยให้นกั พฒั นาเว็บเพจสามารถเขียนเว็บเพจที่เป็ นแบบไดนามิคไดอ้ ย่างรวดเร็ว ภาษา PHP จะ ทางานร่วมกนั กบั เอกสาร HTML โดยการสร้างโคด้ แทรกระหวา่ ง Tag HTML และสร้างเป็นไฟล์ ที่มี นามสกุล .PHP, PHP 3 หรือ PHP 4 ไวยากรณ์ที่ใชใ้ น PHP เป็นการนารูปแบบของภาษา

16 ต่าง ๆ มารวมกนั ไดแ้ ก่ C Perl และ Java ทาใหผ้ ูใ้ ชท้ ่ีมีพ้ืนฐานของภาษาเหล่าน้ีสามารถใชง้ าน PHP ไดไ้ ม่ยาก เนื่องจาก PHP จะทางานโดยมีตวั แปลและเอ็กซิคิวต์ที่ฝั่งเซิร์ฟเวอร์ อาจจะเรียกการ ทางานวา่ เป็นเซิร์ฟเวอร์ไซด์ (Server Side) ส่วนการทางานของบราวเซอร์ของผใู้ ชเ้ รียนวา่ ไคลเอน ไซด์ (Client Side) โดยการทางานจะเริ่มตวั ที่ผใู้ ชส้ ่งความตอ้ งการผา่ นเว็บบราวเซอร์ทาง HTTP (HTTP Request) ซ่ึงอาจเป็ นการกรอกแบบฟอร์มหรือใส่ขอ้ มูลที่ด้องการหรือแสดงดูเฉย โดย เรียกเอกสาร PHP (เอกสารน้นั จะมีส่วนขยายเป็ น PHP) เช่น Test PHP เมื่อเอกสาร PHP เขา้ มาถึงเว็บเซิร์ฟเวอร์ก็จะถูกส่งต่อไปให้ PHP Interpreter เพื่อทาหน้าที่แปลคาสั่งแลว้ เอ็กซิคิวต์ คาส่ังตามบรรทดั ท่ีระบุบคาส่ังน้ัน ๆ จากน้นั PHP จะสร้างผลลพั ธ์ในรูปแบบเอกสาร HTML ส่งกลบั ไปใหเ้ วบ็ เซิร์ฟเวอร์เพ่อื ส่งต่อไปใหบ้ ราวเซอร์แสดงผลทางฝั่งผใู้ ชต้ อ่ ไป (HTTP Response) 2.8.2.1 จากไคลเอนตจ์ ะเรียกไฟล์ PHP Script ผา่ นทางโปรแกรมบราวเซอร์ (Internet Explore) 2.8.2.2 บราวเซอร์จะส่งคาร้อง (Request) ไปยงั เว็บเซิร์ฟเวอร์ผ่านทางเครือข่าย อินเทอร์เนต็ 2.8.2.3 เมื่อเวบ็ เซิร์ฟเวอร์รับคารองขอจากบราวเซอร์แลว้ ก็จะนาสคริปต์ PHP ท่ีเก็บอยู่ ในเซิร์ฟเวอร์มาประมวลผลดว้ ยโปรแกรมแปลภาษา PHP ที่เป็นอินเตอร์พรีเตอร์ 2.8.2.4 กรณีที่ PHP Script มีการเรียกใช้ขอ้ มูลก็จะติดต่อกบั ฐานขอ้ มูลต่าง ๆ ผ่าน ทาง ODBC Connection ถา้ เป็นฐานขอ้ มูลกลุ่ม Microsoft SQL Server, Microsoft Access, Fox Pro หรือใช้ Function Connection ที่มีอยใู่ น PHP Library ในการเช่ือมต่อฐานขอ้ มลู เพ่ือดึงขอ้ มูล ออกมาหลกั จากแปลสคริปต์ PHP เสร็จแลว้ จะไดร้ ับไฟล์ HTML ใหม่ที่มีแตแ่ ทกซ์ HTML ไปยงั Web Service 2.8.2.5 Web Service ส่งไฟล์ HTML ท่ีไดผ้ า่ นการแปลแลว้ กลบั ไปยงั บราวเซอร์ที่ร้อง ขอผา่ น ทางเครือขา่ ยอินเตอร์เน็ต 2.8.2.6 บราวเซอร์รับไฟล์ HTML ที่เว็บเซิร์ฟเวอร์ส่งมาให้แปล HTML แสดงผล ออกมาทางจอภาพเป็นเวบ็ เพจ โดยใชต้ วั แปลภาษา HTML ที่อยู่ในบราวเซอร์ซ่ึงเป็ นอินเตอร์ พรีเตอร์ เช่นเดียวกนั (ซาฟี อาแว และคณะ, ออนไลน์)

17 2.8.3 Bootstrap Bootstrap น้ีมนั คอื Front-End Framework ตวั หน่ึง คาวา่ Front-End หมายถึง ส่วนที่ แสดงผลให้ Users ทวั่ ไปเห็นพูดง่าย ๆ ก็คือหน้าเว็บไซต์ของเรานนั่ เอง ส่วนคาว่า Framework น้นั จะหมายถึง สิ่งท่ีเขา้ มาช่วยกาหนดกรอบของการทางานให้เป็ นไปในทางเดียวกนั ในสมยั ก่อน เรายงั ไม่มี Framework ปัญหาที่เราพบเป็นประจาในการทางานร่วมกนั ก็คอื ต่างคนต่างทาคนหน่ึง เขยี นแบบหน่ึง ส่วนอีกคนกเ็ ขียนอีกแบบหน่ึงพอใครจะมาแกง้ านต่อหรือพฒั นาต่อก็จะไม่เขา้ ใจกนั เพราะไม่ไดม้ ีการกาหนดขอ้ ตกลงกนั ไวล้ ่วงหนา้ ทาให้เสียเวลาโดยใช่เหตุ Framework จะเขา้ มา แกป้ ัญหาตรงน้ีโดยมนั จะเป็นตวั กาหนดใหส้ มาชิกในทีมเขา้ ใจตรงกนั ปฏิบตั ิไปในแนวทางเดียวกนั สมมติ วา่ โจทยข์ องเราคือการสร้างกลอ่ งส่ีเหล่ียมสีน้าเงินข้นึ มาสกั กลอ่ งหน่ึง ถา้ เราใช้ Framework แลว้ ล่ะก็พนกั งานแต่ละคนจะใชว้ ิธีเดียวกนั ในการสร้างกล่องน้ีข้ึนมา แมว้ า่ พวกเคา้ จะไม่ไดค้ ุยกนั เลยก็ตามและพนกั งานคนอื่น ๆ ท่ีไม่เคยทราบโจทยม์ าก่อนก็จะสามารถรู้ไดท้ นั ทีวา่ โคด้ ท่ีพวกเคา้ เขยี นข้นึ มามนั คือการสร้างกล่องสีน้าเงิน (สุรนนั ทน์ เนียมคา, ออนไลน)์ 2.8.4 Jquery Mobile JQuery คือไลบรารีของโคด้ จาวาสคปิ ต์ (Javascript Library) ซ่ึงส่วนหน่ึงของการสร้าง เว็บไซต์ JQuery ท่ีเขามาช่วยอานวยความสะดวกในการสร้างสีสันต่าง ๆ ให้แก่เว็บไซต์โดยท่ี ผพู้ ฒั นาไม่ตอ้ งเสียเวลาในการพฒั นาโคด้ โปรแกรม ให้ยุ่งยากซบั ซ้อน เหมือนแต่ก่อนและช่วยให้ เราเรียกเขียนหรือใช้จาวาสคริปต์แล้ะ Ajax ให้ง่ายข้ึนหรือจะเขียน JavaScript เพ่ือดัก Even (เหตกุ ารณ์) ตา่ ง ๆ ที่ตอ้ งการเช่นการ Click, Rollover, Mouse J Query เปิ ดตวั คร้ังแรกในงานบาร์ แคมป์ นิวยอร์ โดย จอห์น เรซิก (John Resig) เม่ือวนั ที่ 14 มกราคม พ.ศ. 2549 ตวั โค้ดของ JQuery มีลิขสิทธ์ิและสัญญาอนุญาตแบบ Open Source โดยใช้สัญญาอนุญาตของ GFDL และ MIT License 2.8.4.1 ความสามารถของ JQuery 1) ใชง้ าน JQuery Dom Element โดยการเขยี นไม่จาเป็นตอ้ งยดึ ติดกบั Browser 2) จดั การกบั Event เพ่ิม Event ลงในหนา้ เวบ็ ตามแต่ใจตอ้ งการ

18 3) สามารถจดั การกบั CSS (Style Sheet) ของ Element น้นั ๆ ได้ 4) สามารถใส่ Effects And สร้าง Animations ลกู เล่นบนหนา้ เวบ็ ได้ 5) ช่วยใหเ้ ขยี น Ajax ใจงา่ ยทาใหป้ ระหยดั เวลาในการเขยี นทาใหโ้ คด้ ส้นั 6) ทา Effect ตา่ ง ๆ กบั Element ที่เราตอ้ งการ 7) คน้ หา Lemont ท่ีเราตอ้ งการและจัดการเพิ่มหรือลบ Attributes ที่ตอ้ งการ ได้ (สานกั เทคโนโลยสี ารสนเทศ, ออนไลน)์ 2.8.5 Xampp โปรแกรม Apache Web Server ไวจ้ าลอง Web Server เพ่อื ไวท้ ดสอบสคริปหรือเวบ็ ไซต์ ในเคร่ืองของเรา โดยที่ไม่ตอ้ งเชื่อมต่ออินเตอร์เน็ตและไม่ตอ้ งมีค่าใชจ้ ่ายใด ๆ งา่ ยต่อการติดต้งั และ ใช้งานโปรแกรม Xampp จะมาพร้อมกับ PHP ภาษาสาหรับพฒั นาเว็บแอพลิเคช่ันที่เป็ นท่ีนิยม, MySQL ฐานขอ้ มูล, Apache จะทาหนา้ ที่เป็นเวบ็ เซิร์ฟเวอร์, Perl อีกท้งั ยงั มาพร้อมกบั OpenSSL, PHPMyadmin (ระบบบริ หารฐานข้อมูลท่ีพัฒนาโดย PHP เพื่อใช้เชื่อมต่อไปยังฐานข้อมูล สนับสนุนฐานขอ้ มูล MySQL และ SQLite โปรแกรม Xampp จะอยู่ในรูปแบบของไฟล์ Zip, Tar, 7z หรือ EXE โปรแกรม Xampp อยภู่ ายใตใ้ บอนุญาตของ GNU General Public License แต่ บางคร้ังอาจจะมีการเปลี่ยนแปลงเรื่องของลิขสิทธ์ิในการใช้งาน จึงควรติดตามและตรวจสอบ โปรแกรมดว้ ย นกั พฒั นาเวบ็ ไซดห์ ลายคน อาจจะเคยเจอประสบการณ์ที่ยากลาบากในการจาลอง เคร่ืองคอมพวิ เตอร์ตวั เอง ใหก้ ลายเป็น เวบ็ เซิร์ฟเวอร์ เพ่ือจะสามารถทดสอบการเขยี นโปรแกรมบน เวบ็ ไซด์ได้ เพราะวา่ จะตอ้ งติดต้งั เวบ็ เซิร์ฟเวอร์ (จะเป็น IIS หรือ Apache ก็ตาม) และก็ตอ้ งติดต้งั PHP หรือ Perl แลว้ ก็ตามดว้ ยการติดต้งั MySQL เพื่อจดั การฐานขอ้ มูล และ อื่น ๆ อีกมากมาย ที่ เราใหเ้ ราปวดหัววนั น้ี โปรแกรม XAMPP ช่วยท่านได้ เพราะวา่ โปรแกรม XAMPP เป็นโปรแกรม Apache เว็บเซิร์ฟเวอร์ ท่ีมาพร้อม MySQL, PHP และ Perl โปรแกรม XAMPP จึงง่ายต่อการ ติดต้งั และใช้งาน แค่ดาวน์โหลด กระจายไฟล์ออก แลว้ ก็ติดต้งั ใช้งานได้เลย XAMPP เป็ น โปรแกรมจาลองเคร่ืองตวั เองเป็นเซิฟเวอร์โดยในตวั โปรแกรมน้ีจะมีโปรแกรมหลายๆตวั ท่ีทางาน ประสานเก่ียวขอ้ งกนั ขา้ งในอาทิ Apache, Mysql, FileZilla, Mercury จุดเด่นของโปรแกรมตวั น้ี คือมีตัวช่วยเช็คข้อผิดพลาดในการ Config แบบออโต้ท่ีสาคัญคือถูกออกแบบมาทางานแบบ Protable (สามารถก๊อปป้ี ไปไวท้ ี่หน่ึงหรืออีกเครื่องอื่นไดส้ ะดวกมาก) XAMPP เป็ นโปรแกรมท่ี

19 โฮสตเ์ วบ็ เซิฟเวอร์ประเภทต่าง ๆ ท่ีท่านสามารถทาการติดต้งั และใชง้ านไดอ้ ยา่ งง่ายดาย ซอฟตแ์ วร์ น้ีให้ท่านสามารถทาการทดสอบรันเว็บเพ็จของท่านไดบ้ นเคร่ืองคอมพิวเตอร์ของท่าน การต้งั ค่า และเริ่มตน้ เวบ็ เซิฟเวอร์เป็ นเร่ืองที่ยุ่งยากมากแต่ดว้ ย XAMPP ท่านไม่ตอ้ งทาส่ิงท่ียุ่งยากเหล่าน้ัน โปรแกรมน้ีทาทุกอย่างให้สามารถรันได้อย่างราบร่ืนและรวดเร็ว XAMPP ได้รวมโปรแกรม สาหรับนกั พฒั นา เช่น MySQL, PHP, PEAR, PERL, OpenSSL, FileZilla, FTP Server, Mercury Mail และโปรแกรมอ่ืน ๆ มากมายท่ีท่านสามารถใชใ้ นการติดต้งั เว็บเซิฟเวอร์ของท่านเอง น่ีคือ ส่วนประกอบสาคญั ที่ท่านจะตอ้ งมีก่อน เพือ่ ทาการสร้างฐานขอ้ มลู ที่สามารถใชง้ านสาหรับเวบ็ ไซต์ ของท่านไดห้ รือใชส้ าหรับตรวจดูเวบ็ ไซตข์ องท่าน XAMPP เป็ นซอฟต์แวร์ที่สร้างข้ึนมาสาหรับ นกั พฒั นาเวบ็ ไซตแ์ ละนกั สร้างบล็อก อย่างไรก็ตามโปรดทราบว่าโปรแกรมน้ีไม่มีการแนะนาทุก ส่วนของโปรแกรม ดงั น้นั ผูใ้ ชท้ ่ีตอ้ งการใชง้ านจะตอ้ งมีความรู้ในการเขียนโปรแกรมมาพอสมควร กล่าวโดยสรุป XAMPP เป็นเคร่ืองมือท่ีสาคญั สาหรับเวบ็ เซิฟเวอร์และมีการติดต้งั ท่ีง่ายดาย ไม่มี การต้งั คา่ ท่ียงุ่ ยาก (เบญจมาภรณ์ ดาวะที, ออนไลน์) 2.8.6 Visual Studio วิชวลสตูดิโอ คือโปรแกรมตวั หน่ึงท่ีเป็ นเคร่ืองมือท่ีช่วยพฒั นาซอฟต์แวร์และระบบ ต่าง ๆ ซ่ึงสามารถติดต่อส่ือสารพูดคุยกบั คอมพิวเตอร์ไดใ้ นระดบั หน่ึงแลว้ แตย่ งั ไม่สามารถพฒั นา เป็ นระบบเองได้เหมาะสมสาหรับภาษา VB และVB.NET เนื่องจากไมโครซอฟต์ได้พฒั นา โปรแกรมและภาษาข้ึนมาควบคู่กันเพื่อให้ใช้งานได้ซ่ึงกันและกันซ่ึงนักโปรแกรมเมอร์จะนา เครื่องมือมาใช้ในการพฒั นาต่อยอดให้เกิดเป็ นระบบต่าง ๆ หรือเป็นเวบ็ ไซต์ และแอพพลิเคชนั่ ต่าง ๆ ดงั น้ันวิชวลสตูดิโอจึงเป็ นโปรแกรมตวั หน่ึงท่ีเป็ นเครื่องมือท่ีช่วยพฒั นาซอฟต์แวร์และ ระบบต่าง ๆ ซ่ึงโปรแกรมไดม้ ีการติดต่อส่ือสารกบั คอมพิวเตอร์ในระดบั หน่ึงแลว้ แต่ไม่สามารถ พฒั นาเป็ นระบบไดด้ ว้ ยตนเองนักพฒั นาจะนาเคร่ืองมือของโปรแกรมมาใช้พฒั นาต่อให้เกิดเป็ น ซอฟตแ์ วร์หรือระบบตา่ ง ๆ เพื่อช่วยอานวยความสะดวกและลดเวลาการทางานและขอ้ ผิดพลาดได้ เป็นอยา่ งมาก (เอม็ .ดี.ซอฟต,์ ออนไลน)์