International Undergraduate Program Website Development … · 2013-04-01 · iv Akarapong Kanchana-ampol Web Application for International Undergraduate Program Bachelor Degree in

i

โครงงานวิศวกรรมคอมพิวเตอร์ ภาควิชาวิศวกรรมคอมพิวเตอร์

คณะวิศวกรรมศาสตร ์มหาวิทยาลัยเกษตรศาสตร์

เรื่อง

พัฒนาเว็บไซตโ์ครงการเปิดสอนปริญญาตรีนานาชาติ

คณะวิศวกรรมศาสตร์ มหาวิทยาลัยเกษตรศาสตร ์

International Undergraduate Program Website Development

Faculty of Engineering, Kasetsart University

โดย

นายอัครพงษ์ กาญจนอ าพล 5210502694

พ.ศ. 2555

ii

ใบรับรองโครงงานวิศวกรรม ภาควิชาวิศวกรรมคอมพิวเตอร ์

เรื่อง

พัฒนาเว็บไซต์โครงการเปิดสอนปริญญาตรีนานาชาติ

โดย

นาย อัครพงษ์ กาญจนอ าพล เลขประจ าตัว 5210502694

พิจารณาเห็นชอบโดย

อาจารย์ที่ปรึกษาโครงงาน .............................................................. (ผศ.อินทิราภรณ์ มูลศาสตร์)

วันที่.........เดือน.............................พ.ศ.............

หัวหน้าภาควิชาวิศวกรรมคอมพิวเตอร์ ..............................................................

(ผศ.ดร. ภุชงค์ อุทโยภาศ)

วันที่.........เดือน.............................พ.ศ.............

iii

นายอัครพงษ์ กาญจนอ าพล

เว็บแอปพลิเคชันส าหรับโครงการปริญญาตรีนานาชาติ ปริญญาวิศวกรรมศาสตรบัณฑิต

(สาขาวิศวกรรมคอมพิวเตอร์) ภาควิชาวิศวกรรมคอมพิวเตอร์

คณะวิศวกรรมศาสตร์ มหาวิทยาลัยเกษตรศาสตร์

บทคัดย่อ

โครงงานพัฒนาเว็บไซตโ์ครงการเปิดสอนปริญญาตรีนานาชาติ เป็นการสร้างเว็บไซต์ของโครงการ IUP มหาวิทยาลัยเกษตรศาสตร์เพื่อน าเสนอข่าวสารของภาควิชา ข้อมูลเกี่ยวกับสาขาวิชา เช่น ข้อมูลบุคลากร ข้อมูลหลักสูตรการศึกษา ข้อมูลใบค าร้องต่างๆ และเอกสารที่เกี่ยวข้องต่างๆ เป็นต้น เว็บไซต์แบ่งออกเป็น 2 ส่วนการท างาน คือ เว็บไซต์ของโครงการเพ่ือประชาสัมพันธ์ข่าวสารต่างๆ ทั่วไป และระบบสมัครเรียนออนไลน์เพ่ือใช้ในการรับสมัครนิสิตใหม่ ซึ่งเป็นระบบที่โครงการยังไม่มี เพ่ืออ านวยความสะดวกในการสมัครเรียน

ค าส าคัญ Wordpress, PHP

iv

Akarapong Kanchana-ampol

Web Application for International Undergraduate Program

Bachelor Degree in Engineering Department Computer Engineering

Faculty of Engineering, Kasetsart University

Abstract

International Undergraduate Program development project is implemented for IUP, Kasetsart University to present IUP’s news, information and information such as managerial board, course scheme, petition form, relevant document, etc. This website is divided into two parts, the first part is website sharing information and Online admission system which IUP do not have for facilitating in applying for studying

Keyword: Wordpress, PHP

v

กิตติกรรมประกาศ

การด าเนินโครงงาน “พัฒนาเว็บไซต์โครงการเปิดสอนปริญญาตรีนานาชาติ” เริ่มจากการที่เว็บไซต์เก่าของ IUP นั้นยังไม่มีระบบการสมัครเรียนออนไลน์ อีกท้ังยังมีแนวคิดในการเปลี่ยนหน้าตาเว็บไซต์กระผมจึงได้จัดท าโครงงานนี้ขึ้นมา

ขอกราบขอบคุณ ผศ. อินทิราภรณ์ มูลศาสตร์ อาจารย์ที่ปรึกษาโครงงานที่คอยให้ค าปรึกษา คอยชี้แนะให้โครงงานส าเร็จลุล่วงไปด้วยดี ขอขอบคุณเพ่ือน CPE 23 ทุกคนที่คอยช่วยเหลือในการท าโครงงานนี้ ทุกค าถามที่คอยอธิบายและคอยช่วยแก้ปัญหา

อัครพงษ์ กาญจนอ าพล

ผู้จัดท า

vi

สารบัญ

สารบัญ ................................................................................................................................................................. vi

สารบัญภาพ ........................................................................................................................................................ viii

สารบัญตาราง ....................................................................................................................................................... xi

1. บทน า ........................................................................................................................................................ 1

1.1 วัตถุประสงค์ของโครงงาน ..................................................................................................................... 1

1.2 ขอบเขตของโครงงาน ............................................................................................................................ 1

1.3 ประโยชน์ที่ได้รับ ................................................................................................................................... 2

2. ทฤษฎีที่เกี่ยวข้อง ....................................................................................................................................... 3

2.1 HTML ................................................................................................................................................... 3

2.2 PHP ...................................................................................................................................................... 3

2.3 CSS ....................................................................................................................................................... 4

2.4 SQL ...................................................................................................................................................... 4

2.5 Wordpress .......................................................................................................................................... 5

2.6 ระบบการจัดการฐานข้อมูล (DBMS: Database Management System) ........................................... 6

3. เครื่องมือที่ใช้ในการท าโครงงาน ................................................................................................................ 8

3.1 Software .............................................................................................................................................. 8

4. วิธีการด าเนินโครงงาน ............................................................................................................................... 9

4.1 องค์ประกอบโดยรวมของระบบ ............................................................................................................. 9

4.2 กระบวรการท างานของระบบ ............................................................................................................. 10

4.2.1 Web Site .................................................................................................................................. 10

4.2.2 ระบบสมัครออนไลน์ .................................................................................................................. 12

4.3 ขั้นตอนการพัฒนา .............................................................................................................................. 16

4.3.1 การออกแบบฐานข้อมูล .................................................................................................................. 16

4.3.2 พจนานุกรมฐานข้อมูล ................................................................................................................ 17

vii

4.3.3 E-R Diagram ............................................................................................................................. 20

4.3.4 การเชื่อมความสัมพันธ์ (Relationship) ..................................................................................... 20

5. ผลการด าเนินโครงงานและวิจารณ์ .......................................................................................................... 23

5.1 ส่วนแสดงข่าวสารของเว็บไซต์ ............................................................................................................ 23

5.2 ส่วนของการ Search .......................................................................................................................... 23

5.3 Menu ................................................................................................................................................ 24

5.4 ส่วนของระบบสมัครเรียน ................................................................................................................... 25

5.4.1 การ login ดูข้อมูลในส่วนของ admin ....................................................................................... 25

5.4.2 การสมัครส่วนของ user ............................................................................................................. 26

6. สรุปผลการด าเนินงานและข้อเสนอแนะ .................................................................................................. 27

6.1 ข้อสรุป ............................................................................................................................................... 27

6.2 ปัญหาและอุปสรรค ............................................................................................................................ 27

6.3 6.3 แนวการการพัฒนาต่อ ................................................................................................................ 27

7. บรรณานุกรม ........................................................................................................................................... 28

8. ภาคผนวก ................................................................................................................................................ 29

8.1 การติดตั้งและใช้งาน Appserv เบื้องต้น ............................................................................................. 29

8.2 การติดตั้ง Wordpress ....................................................................................................................... 37

9. ประวัตินิสิต ............................................................................................................................................. 44

viii

สารบัญภาพ

รูปที่ 2-1 การท างานของ PHP ............................................................................................................................... 3

รูปที่ 2-2 Wordpress ............................................................................................................................................ 5

รูปที่ 4-1 รูปแบบการเชื่อมต่อของระบบ ................................................................................................................ 9

รูปที่ 4-2 หน้าเว็บไซต์ ......................................................................................................................................... 10

รูปที่ 4-3 Flowchart การรับสมัครเรียน ............................................................................................................. 12

รูปที่ 4-4 Flowchart การสมัครออนไลน์ในส่วน User ....................................................................................... 14

รูปที่ 4-5 Flowchart ส่วนของ Admin .............................................................................................................. 15

รูปที่ 4-6 แผนภาพ E-R Diagram ....................................................................................................................... 20

รูปที่ 4-7 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ member ............................................................. 20

รูปที่ 4-8 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ passport ............................................................. 21

รูปที่ 4-9 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ acadequal .......................................................... 21

รูปที่ 4-10 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ acadeaward ..................................................... 21

รูปที่ 4-11 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ stat .................................................................... 21

รูปที่ 4-12 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ program ........................................................... 22

รูปที่ 4-13 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ upload ............................................................. 22

รูปที่ 4-14 แผนภาพแสดงความสัมพันธ์ระหว่าง upload กับ doctype ............................................................ 22

รูปที่ 5-1 ส่วนแสดงข่าวสาร ................................................................................................................................ 23

รูปที่ 5-2 ส่วนการ search ข้อมูล ....................................................................................................................... 23

รูปที่ 5-3 Menu ................................................................................................................................................. 24

รูปที่ 5-4 child-page ......................................................................................................................................... 24

รูปที่ 5-5 หน้า login ........................................................................................................................................... 25

รูปที่ 5-6 หน้า admin ........................................................................................................................................ 25

รูปที่ 8-1 ............................................................................................................................................................. 29

รูปที่ 8-2 ............................................................................................................................................................. 29

ix

รูปที่ 8-3 ............................................................................................................................................................. 30

รูปที่ 8-4 ............................................................................................................................................................. 30

รูปที่ 8-5 ............................................................................................................................................................. 31

รูปที่ 8-6 ............................................................................................................................................................. 31

รูปที่ 8-7 ............................................................................................................................................................. 32

รูปที่ 8-8 ............................................................................................................................................................. 32

รูปที่ 8-9 ............................................................................................................................................................. 33

รูปที่ 8-10 ........................................................................................................................................................... 33

รูปที่ 8-11 ........................................................................................................................................................... 34

รูปที่ 8-12 ........................................................................................................................................................... 34

รูปที่ 8-13 ........................................................................................................................................................... 34

รูปที่ 8-14 ........................................................................................................................................................... 35

รูปที่ 8-15 ........................................................................................................................................................... 35

รูปที่ 8-16 ........................................................................................................................................................... 35

รูปที่ 8-17 ........................................................................................................................................................... 36

รูปที่ 8-18 ........................................................................................................................................................... 36

รูปที่ 8-19 ........................................................................................................................................................... 37

รูปที่ 8-20 ........................................................................................................................................................... 37

รูปที่ 8-21 ........................................................................................................................................................... 38

รูปที่ 8-22 ........................................................................................................................................................... 38

รูปที่ 8-23 ........................................................................................................................................................... 39

รูปที่ 8-24 ........................................................................................................................................................... 40

รูปที่ 8-25 ........................................................................................................................................................... 40

รูปที่ 8-26 ........................................................................................................................................................... 41

รูปที่ 8-27 ........................................................................................................................................................... 41

รูปที่ 8-28 ........................................................................................................................................................... 42

x

รูปที่ 8-29 ........................................................................................................................................................... 42

รูปที่ 8-30 ........................................................................................................................................................... 43

xi

สารบัญตาราง

ตารางที่ 4-1 member ....................................................................................................................................... 17

ตารางที่ 4-2 student ........................................................................................................................................ 17

ตารางที ่4-3 program ....................................................................................................................................... 18

ตารางที่ 4-4 choose ......................................................................................................................................... 18

ตารางที่ 4-5 acadequal ................................................................................................................................... 18

ตารางที่ 4-6 acadeaward................................................................................................................................. 18

ตารางที่ 4-7 upload ......................................................................................................................................... 19

ตารางที่ 4-8 doctype ....................................................................................................................................... 19

ตารางที่ 4-9 passport ....................................................................................................................................... 19

ตารางที่ 4-10 stat ............................................................................................................................................. 19

1

1. บทน า

โครงการเปิดสอนปริญญาตรีนานาชาติ (IUP) คณะวิศวกรรมศาสตร์ มหาวิทยาลัยเกษตรศาสตร์ นั้นปัจจุบันมีเว็บไซต์ แต่ไม่ได้ใช้ประโยชน์สูงสุดเนื่องด้วยการจัดรูปแบบหน้าเว็บไซต์ยังไม่สวยงาม การจัดข้อมูลของเว็บไซต์ยังไม่เป็นระบบและไม่มีความเป็นระเบียบท าให้ยากต่อการค้นหาข้อมูลเกี่ยวกับสาขาวิชา การค้นหาเอกสารที่เกี่ยวข้องกับการสมัครในเว็บไซต์ เช่น เอกสารการรับสมัครหรือเอกสารอ่ืนๆ ท าได้ยาก การจัดการเมนูต่างๆ ในเว็บไซต์ยังไม่เป็นสากล ยังไม่มีข้อมูลเกี่ยวกับวิธีการยื่นค าร้องต่างๆ

นอกจากนีโ้ครงการเปิดสอนปริญญาตรีนานาชาติ (IUP) ต้องการรับสมัครนิสิตที่สนใจด้วยระบบออนไลน์ เพ่ือความสะดวกในการสมัครและการด าเนินงานดังนั้นจึงต้องการระบบล็อกอินและระบบฐานข้อมูลที่ดีเพ่ือให้การใช้งานได้อย่างมีประสิทธิภาพ

จากปัญหาที่กล่าวมาข้างต้นนั้นสามารถแก้ไขโดยการสร้างเว็บไซตส์ าหรับโครงการเปิดสอนปริญญาตรีนานาชาติ (IUP) ขึ้นมาใหม่โดยมีการจัดหน้าเว็บไซต์เป็นสากลและมีความสวยงาม มีระบบที่ใช้ในการรับสมัครนิสิตแบบออนไลน์จึงต้องใช้ระบบฐานข้อมูลที่มีประสิทธิภาพและมีก าหนดสิทธิ์ให้กับผู้ที่สามารถเข้าถึงข้อมูลได้โดยสิทธิ์ของผู้ที่สามารถเข้าถึงฐานข้อมูลนั้นมีความแตกต่างกันเพ่ือให้ทราบถึงความรับผิดชอบว่าใครบ้างที่มีสิทธิ์ในการเปลี่ยนแปลงข้อมูลภายในฐานข้อมูลนั้น และใครบ้างที่สามารถจะมองเห็นข้อมูลและน าข้อมูลไปใช้เท่านั้น

1.1 วัตถุประสงค์ของโครงงาน

เพ่ือพัฒนาโปรแกรมประยุกต์ที่ใช้งานบนอินเตอร์เน็ต

1) เพ่ือให้นักเรียนที่สนใจสมัครเข้าเรียนโครงการ IUP และนิสิตแต่ละคนสามารถเข้ามาอ่านข่าวสารของทางโครงการ IUP ผ่านเว็บไซต์ภาควิชาอย่างถูกต้อง

2) เพ่ืออ านวยความสะดวกให้ผู้ที่มีความเก่ียวข้องกับการรับสมัครนิสิตของสาขาวิชาทั้งการรับสมัครออนไลน์และออฟไลน์

3) เพ่ืออ านวยความสะดวกให้กับบุคลากรที่เกี่ยวข้องในการรับสมัคร

1.2 ขอบเขตของโครงงาน

ออกแบบและพัฒนาระบบในส่วนของ 1) เว็บไซท์โครงการ IUP คณะวิศวกรรมศาสตร์ มหาวิทยาลัยเกษตรศาสตร์ 2) การกรอกแบบฟอร์มการสมัครโครงการ IUP แบบออนไลน์ 3) ระบบสมาชิกที่มกีารแบ่งระดับการเข้าถึงข้อมูลโดยมีการล็อกอิน

2

1.3 ประโยชน์ที่ได้รับ

1) ให้ความสะดวกนักเรียนที่ต้องการสมัครเข้าโครงการ IUP ซึ่งอาจอยู่ต่างจังหวัดหรือต่างประเทศ ไม่ต้องเดินทางมาที่มหาวิทยาลัยเกษตรศาสตร์

2) นิสิตปัจจุบันของโครงการ IUP สามารถดูข่าวสารและข้อมูลได้สะดวก 3) ท าให้เจ้าหน้าที่และนิสิตมีความสะดวกในการเข้าถึงข้อมูลที่สนใจ 4) ท าให้มีแหล่งเผยแพร่ข่าวสารของโครงการ IUP ได้ถูกต้อง

3

2. ทฤษฎีท่ีเกี่ยวข้อง

2.1 HTML

HTML (Hypertext Markup Language) HTML คือ ภาษาที่ใช้ในการเขียนเว็บเพจ ย่อมาจากค าว่า Hypertext Markup Language โดย Hypertext หมายถึง ข้อความที่เชื่อมต่อกันผ่านลิ้ง (Hyperlink) Markup หมายถึง วิธีในการเขียนข้อความ language หมายถึงภาษา ดังนั้น HTML ก็คือ ภาษาท่ีใช้ในการเขียนข้อความ ลงบนเอกสารที่ต่างก็เชื่อมถึงกันใน cyberspace ผ่าน Hyperlink ท าให้สามารถน าข้อความหรือรูปภาพต่างๆ มาแสดงลงบนเว็บไซต์ได้ [1]

2.2 PHP

PHP (Professional Home Page) คือ ภาษาจ าพวก Script Language ค าสั่งต่างๆ จะเก็บอยู่ในไฟล์ที่เรียกว่า สคริปต์ (Script) และเวลาใช้งานต้องอาศัยตัวแปรชุดค าสั่ง ซึ่งท างานโดยการสั่งงานจากเว็บเพจ แต่ไปประมวลผลที่ Web Server ส าหรับแสดงเว็บเพจอย่างหนึ่ง ที่จัดอยู่ในกลุ่ม Server Side Script และจะท างานในฝั่ง Server แล้วส่งการแสดงผลมายัง Browser ของตัว Client นอกจากนี้มันยังเป็น Script ที่ Embed บน HTML อีกด้วย ส่วนเลขท่ีต่อท้ายก็หมายถึงรุ่น (version) นั่นเอง และก าลังเป็นที่นิยมกันมากในหมู่นักสร้างเว็บทั่วโลก ตัวอย่างของภาษาสคริปต์ก็ เช่น Java Script, Perl, ASP (Active Server Page) เป็นต้น

PHP เป็นภาษาสคริปต์ที่มีความสามารถสูง ส าหรับการพัฒนา Web Site และความสามารถที่โดดเด่นอีกประการหนึ่งของ PHP คือ database enabled web page ท าให้เอกสารของ HTML สามารถที่จะเชื่อมต่อกับระบบฐานข้อมูล (database) ได้อย่างมีประสิทธิภาพและรวดเร็ว จึงท าให้การจัดเก็บ ข้อมูลต่างๆ ที่ส าคัญผ่านทาง Internet เป็นไปได้อย่างง่ายดาย [2]

รูปที่ 2-1 การท างานของ PHP

4

2.3 CSS

CSS (Cascading Style Sheets) มักเรียกโดยย่อว่า "สไตล์ชีต" คือภาษาท่ีใช้เป็นส่วนของการจัดรูปแบบการแสดงผลเอกสาร HTML โดยที่ CSS ก าหนดกฎเกณฑ์ในการระบุรูปแบบ (หรือ "Style") ของเนื้อหาในเอกสาร เช่น สีของข้อความ สีพ้ืนหลัง ประเภทตัวอักษร และการจัดวางข้อความ ซึ่งการก าหนดรูปแบบ หรือ Style นี้ใช้หลักการของการแยกเนื้อหาเอกสาร HTML ออกจากค าสั่งที่ใช้ในการจัดรูปแบบการแสดงผล ก าหนดให้รูปแบบของการแสดงผลเอกสาร ไม่ข้ึนอยู่กับเนื้อหาของเอกสาร เพ่ือให้ง่ายต่อการจัดรูปแบบการแสดงผลลัพธ์ของเอกสาร HTML โดยเฉพาะในกรณีท่ีมีการเปลี่ยนแปลงเนื้อหาเอกสารบ่อยครั้ง หรือต้องการควบคุมให้รูปแบบการแสดงผลเอกสาร HTML มีลักษณะของความสม่ าเสมอทั่วกันทุกหน้าเอกสารภายในเว็บไซต์เดียวกัน

ความสามารถของ CSS

CSS มีคุณสมบัติมากกว่า tag ของ html เช่น การก าหนดกรอบให้ข้อความ รวมทั้งสี รูปแบบของข้อความท่ีกล่าวมาแล้ว

CSS นั้นก าหนดที่ต้นของไฟล์ html หรือต าแหน่งอ่ืน ๆ ก็ได้ และสามารถมีผล กับเอกสารทั้งหมด หมายถึงก าหนด ครั้งเดียวจุดเดียวก็มีผลกับการแสดงผลทั้งหมด ท าให้เวลาแก้ไขหรือปรับปรุงท าได้สะดวก ไม่ต้องไล่ตามแก้ tag ต่างๆ ทั่วทั้งเอกสาร

CSS สามารถก าหนดแยกไว้ต่างหากจาก ไฟล์เอกสาร html และสามารถน ามาใช้ร่วม กับเอกสารหลายไฟล์ได้ การแก้ไขก็แก้เพียง จุดเดียวก็มีผลกับเอกสารทั้งหมด CSS กับ HTML / XHTML นั้นท าหน้าที่คนละอย่างกัน โดย HTML / XHTML จะท าหน้าที่ในการวางโครงร่างเอกสารอย่างเป็นรูปแบบ ถูกต้อง เข้าใจง่าย ไม่เก่ียวข้องกับการแสดงผล ส่วน CSS จะท าหน้าที่ในการตกแต่งเอกสารให้สวยงาม เรียกได้ว่า HTML /XHTML คือส่วน coding ส่วน CSS คือส่วน design [3]

2.4 SQL

sql เป็นภาษาท่ีใช้ในส าหรับการเรียกใช้ฐานข้อมูล ซึ่งย่อมาจาก "structured query language" โดยที่ sql เป็นภาษาท่ีมีมาตรฐานและเป็นระบบเปิด (open system) หมายถึงเราสามารถใช้ค าสั่ง sql กับฐานข้อมูลชนิดใดก็ได้ และ ค าสั่งงานเดียวกันเมื่อสั่งงานผ่าน ระบบฐานข้อมูลที่แตกต่างกันจะได้ ผลลัพธ์เหมือนกัน ท าให้เราสามารถเลือกใช้ฐานข้อมูล ชนิดใดก็ได้โดยไม่ติดยึดกับฐานข้อมูลใดฐานข้อมูลหนึ่ง ประโยชน์ของ sql นอกเหนือจากที่กล่าวข้างต้นแล้ว คือการท างานของโปรแกรมฐานข้อมูลบน server เมื่อเราใช้ sql โปรแกรมจะท างานได้เร็วกว่าการใช้ table ความสามารถของภาษา sql ยังมีมากกว่าการจัดการ table เราสามารถใช้ sql

5

ท างานอ่ืน ๆ เช่นการใช้ stored procedure เพ่ือให้การท างานกับฐานข้อมูลเกิดข้ึนภายใน server เท่านั้น ไม่ต้องส่งข้อมูลกลับไปมากับเครื่อง client ซึ่งจะมีผลให้การท างานเร็วขึ้น

ภาษา sql จะมีค าสั่งหลัก ๆ อยู่ 2 ประเภท คือ

DDL - data definition language ใช้ในการจัดการโครงสร้างของ table, view แลindex เช่น ค าสั่ง create, alter เป็นต้น

DML - data manipulation language ใช้ในการปรับปรุงข้อมูลภายใน table เช่น ค าสั่ง select, insert, update, delete [4]

2.5 Wordpress

WordPress เป็น open source web software ที่เราสามารถติดตั้งบนเว็บ server ของเราเพ่ือสร้างเว็บไซต์, blog หรือ community ตอนเริ่มแรก WordPress เป็นเครื่องมือไว้ส าหรับสร้าง blog แต่ได้รับการพัฒนามาเรื่อย ๆ จนสามารถสร้างเป็นเว็บไซต์ หรือ เว็บ community ได้แล้ว โดยมีระบบจัดการบทความ หรือ Content Management System (CMS) ท าให้ง่ายต่อการใช้งาน ซึ่ง WordPress สร้างข้ึนโดย Matt Mullenweg และ Mike Little ในปี 2003 นับว่ามีการพัฒนามาถึง 9 ปีแล้ว WordPress ได้รับความนิยมเป็นอย่างมากจากบล็อกเกอร์ทั่วโลก เนื่องจากเป็นระบบที่มีความยืดหยุ่นในการใช้งาน อีกท้ังยังมีผู้ที่สร้างปลั๊กอิน (โปรแกรมเสริม) , ธีม (รูปแบบการแสดงผล) , รวมทั้งระบบอื่นๆ ที่สามารถใช้งานร่วมกับ WordPress ได้เป็นจ านวนมาก จึงท าให้ เวิร์ดเพรสส์ได้รับความนิยมอย่างยิ่ง [5]

รูปที่ 2-2 Wordpress

6

2.6 ระบบการจัดการฐานข้อมูล (DBMS: Database Management System)

ระบบฐานข้อมูล (Database) หมายถึง กลุ่มของข้อมูลที่มีความสัมพันธ์กันและถูกน ามาจัดเก็บในที่เดียวกัน โดยข้อมูลอาจเก็บไว้ในแฟ้มข้อมูลเดียวกันหรือแยกเก็บหลาย ๆ แฟ้มข้อมูล แต่ต้องมีการสร้างความสัมพันธ์ระหว่างข้อมูลเพื่อประสิทธิภาพในการจัดการข้อมูลในการจัดเก็บข้อมูลในระบบฐานข้อมูลมีข้อดีกว่าการจัดเก็บข้อมูลในระบบแฟ้มข้อมูลพอสรุปประเด็นหลัก ๆ ได้ดังนี้

มีการใช้ข้อมูลร่วมกัน (data sharing) ลดความซ้ าซ้อนของข้อมูล (reduce data redundancy) ข้อมูลมีความถูกต้องมากข้ึน (improved data integrity) เพ่ิมความปลอดภัยให้กับข้อมูล (increased security) มีความเป็นอิสระของข้อมูล (data independency)

องค์ประกอบของ DBMS

DBMS หรือ Database Management System คือ โปรแกรมท่ีท าหน้าเป็นตัวกลางระหว่างผู้ใช้ (user) กับฐานข้อมูลเพ่ือจัดการและควบคุมความถูกต้อง ความซ้ าซ้อน และความสัมพันธ์ระหว่างข้อมูลต่างๆ ภายในฐานข้อมูล ซึ่งต่าง ไปจากระบบแฟ้มข้อมูลคือ หน้าที่เหล่านี้จะเป็นของโปรแกรมเมอร์ ในการต่อฐานข้อมูลไม่ว่าจะด้วยการใช้ค าสั่งในกลุ่ม DML หรือ DDLหรือจะด้วยโปรแกรมต่าง ๆ ทุกค าสั่งที่ ใช้กระท ากับฐานข้อมูลจะถูกโปรแกรม DBMS น าไปแปล (Compile) เป็นการกระท า (Operation) ต่างๆภายใต้ค าสั่งนั้นๆ เพื่อน าไปกระท ากับตัวข้อมูลในฐานข้อมูลต่อไปส่วนการท างานต่าง ๆ ภายในโปรแกรม DBMS ที่ท าหน้าที่ในการแปลค าสั่งไปเป็นการ กระท าต่าง ๆ ดังนี้

1) Database Manager เป็นส่วนที่ท าหน้าที่ก าหนดการกระท าต่าง ๆ ให้กับส่วน File Manager เพ่ือไปกระท ากับข้อมูลที่เก็บอยู่ในฐานข้อมูล File Manager เป็นส่วนที่ท าหน้าที่บริหาร และจัดการกับข้อมูลที่เก็บอยู่ในฐานข้อมูลในระดับกายภาพ

2) Query Process เป็นส่วนที่ท าหน้าที่แปลงประโยคค าสั่งของ Query Language ให้อยู่ในรูปแบบของค าสั่งที่ Database Manager เข้าใจ

3) Data Manipulation Language Precompiler เป็นส่วนที่ท าหน้าที่แปลประโยคค าสั่งของกลุ่มค าสั่ง DML ให้อยู่ในรูปแบบที่ส่วน Application Programs Object Code จะน าไปเข้ารหัสเพ่ือส่งต่อไปยังส่วน Database Manager ในการแปลประโยคค าสั่งของกลุ่มค าสั่ง DML ของ Data Manipulation Language Precompiler นี้ จะต้องท างานร่วมกับส่วน Query Processor

7

4) Data Definition Language Precompiler เป็นส่วนที่ท าหน้าที่แปลประโยคค าสั่งของกลุ่มค าสั่ง DDL ให้อยู่ในรูปแบบของ Meta Data (รายละเอียดที่บอกถึงโครงสร้างต่าง ๆ ของข้อมูล) ที่เก็บอยู่ในส่วน Data Dictionary ของฐานข้อมูล

5) Application Programs Object Code เป็นส่วนที่ท าหน้าที่แปลงค าสั่งต่าง ๆ ของโปรแกรมรวมทั้งค าสั่งในกลุ่มค าสั่ง DML ที่ส่งต่อมาจากส่วน Data Manipulation Language Precompiler ให้อยู่ในรูปของ Object Code ที่จะส่งต่อไปให้ Database manager เพ่ือกระท ากับข้อมูลในฐานข้อมูล

โปรแกรม DBMS ถูกพัฒนาขึ้นเพื่อแก้ไขปัญหาด้าน Data Independence ที่ไม่มีในระบบแฟ้มข้อมูล ท าให้มีความเป็นอิสระจากท้ังส่วนของฮาร์ดแวร์ และข้อมูลภายในฐานข้อมูลกล่าวคือโปรแกรม DBMS นี้จะมีการท างานที่ไม่ข้ึนอยู่กับรูปแบบ (Platform) ของตัวฮาร์ดแวร์ ที่น ามาใช้กับระบบฐานข้อมูลรวมทั้งมีรูปแบบในการอ้างถึงข้อมูลที่ไม่ข้ึนอยู่กับโครงสร้างทางกายภาพของข้อมูลด้วยการใช้ Query Language ในการติดต่อกับข้อมูลในฐานข้อมูลแทนค าสั่งภาษาคอมพิวเตอร์ในยุคที่ 3 ส่งผลให้ผู้ใช้สามารถเรียกใช้ข้อมูลจากฐานข้อมูลได้โดยไม่จ าเป็นต้องทราบถึงประเภทหรือขนาดของข้อมูลนั้นหรือสามารถก าหนดล าดับที่ของฟิลด์ ในการก าหนดการแสดงผลได้โดยไม่ต้องค านึงถึงล าดับที่จริงของฟิลด์ นั้น

8

3. เครื่องมือทีใ่ช้ในการท าโครงงาน

3.1 Software

1) window7 ระบบปฏิบัติการของบริษัท Microsoft ใช้ส าหรับ personal computer

2) wordpress 3.4.2 โปรแกรมมีระบบในการช่วยจัดการเนื้อหาบนเว็บหรือ CMS

(Content Management System)

3) MySQL คือระบบจัดการฐานข้อมูลโดยใช้ภาษา SQL เป็นซอฟต์แวร์โอเพนซอร์ส

4) phpMyAdmin โปรแกรมท่ีถูกพัฒนาโดยใช้ภาษา PHP เพ่ือใช้ในการบริหารจัดการฐานข้อมูล Mysql แทนการ คียค์ าสั่ง

5) Notepad++ ใช้ในการเขียนโค้ดภาษาต่างๆ เช่น PHP, HTML

6) Appserv คือโปรแกรมที่รวบรวมเอา Open Source Software หลายๆ อย่างมารวมกัน

โดยมี Package หลัก 4 อย่าง Apache PHP MySQL phpMyAdmin

9

4. วิธีการด าเนินโครงงาน

4.1 องค์ประกอบโดยรวมของระบบ

1) Web Application เป็นหน้าเว็บของโครงการ IUP คอยแสดงข้อมูลข่าวสารต่างๆ ให้นิสิต นักเรียน หรือบุคคลทั่วไปสามารถเข้ามาดูได้

2) Database Server ส่วนฐานข้อมูลท าหน้าที่เก็บข้อมูลต่างๆ เช่น ข้อมูลประจ าตัวผู้สมัครเรียน ข้อมูลอาจารย์ ข้อมูลสมาชิกของเว็บไซต์

รูปที่ 4-1 รูปแบบการเชื่อมต่อของระบบ

Client ติดต่อ Server ด้วย HTTP เพ่ือน าข้อมูลในส่วน Web site มาแสดงผลและ Server ติดต่อ Database เพ่ือน าข้อมูลในฐานข้อมูลมาแสดงผล

10

4.2 กระบวรการท างานของระบบ

โดยส่วนหลักของระบบแบ่งการท างานออกเป็น 2 ส่วนด้วยกันคือ

4.2.1 Web Site

รูปที่ 4-2 หน้าเว็บไซต์

เว็บไซต์นี้มี Site map ดังนี้

News Study

Undergraduate

EMME

ME

SKE Postgraduate Teaching & Learning

Teaching Approach

Learning Facilities

11

Flexible Study

Cooperative Study

Educational Trip Exchange Program Funding

Admission How to apply Tuition Fee Scholarship

Q & A Contact US

Managerial Board Staff Map Make an inquiry

Current Student Life at IUP

Wellbeing & Support Clubs & Societies Our City & Countryside Accommodation Culture on Campus Sport at IUP Living in Thailand Visit Days & Campus Tours

Undergraduate Visit Days

Postgraduate Visit Days

Undergraduate Campus Tours

Visit Days & Campus Tours Calendar

Departmental Open Days

12

Achievement

4.2.2 ระบบสมัครออนไลน์

ระบบสมัครออนไลน์เป็นส่วนที่อ านวยความสะดวกให้ผู้สมัครสามารถสมัครเรียนผ่านระบบนี้โดยการกรอกข้อมูลและการส่งเอกสารการสมัครต่างๆ เช่น Transcript ใบรับรองต่างๆ เป็นต้น ทั้งนี้ระบบการสมัครออนไลน์นั้นมีขั้นตอนการสมัครดังรูป

รูปที่ 4-3 Flowchart การรับสมัครเรียน

13

อธิบายข้ันตอนการรับสมัคร

ประกาศรับสมัคร

ส่งใบสมัครและเอกสารต่างๆ

ตรวจสอบใบสมัคร

ตรวจสอบจ านวนคนรับสมัคร

สอบสัมภาษณ์

ลงทะเบียนยืนยันสิทธิ์

มอบตัว

ปิดรับสมัคร

14

รูปที่ 4-4 Flowchart การสมัครออนไลน์ในส่วน User

15

อธิบายข้ันตอนการสมัครส่วน User

Login เข้าสู่ระบบโดยการกรอก Username และ Password

ระบบท าการตรวจสอบการ login

สมัครเรียนและกรอกข้อมูลการสมัคร

ท าการดู เพ่ิม ลบ แก้ไขข้อมูล

บันทึกข้อมูล

จบการท างานออกจากระบบ

รูปที่ 4-5 Flowchart ส่วนของ Admin

16

อธิบายข้ันตอนในส่วนของ Admin

Login เข้าสู่ระบบโดยการกรอก Username และ Password

ระบบท าการตรวจสอบการ login

ดูข้อมูลการสมัครของผู้สมัคร

ท าการดู เพ่ิม ลบ แก้ไขสถานะการสมัคร

บันทึกข้อมูล

จบการท างานออกจากระบบ

4.3 ขั้นตอนการพัฒนา

4.3.1 การออกแบบฐานข้อมูล

รูปแบบฐานข้อมูลที่ใช้ในการจัดเก็บข้อมูลเกี่ยวกับ นักเรียน ประเภทโครงการ และเอกสารต่างๆ ที่ใช้ในการสมัครเรียน ซึ่งประกอบด้วยตารางทั้งหมด 10 ตาราง

1. member 2. student 3. program 4. choose 5. acadeaward 6. acadequal 7. upload 8. doctype 9. passport 10. stat

17

4.3.2 พจนานุกรมฐานข้อมูล

Field_name Data type

UserID (PK) int(5) not null Username varchar(20) Password varchar(20) Name varchar(100) Status enum(‘ADMIN’, ‘USER’)

ตารางที่ 4-1 member

เก็บข้อมูล user account ของทั้ง admin และ user Field_name Data type

stdid(PK) int(5) not null fname varchar(50) lname varchar(50) birthdate varchar(10) birthcountry varchar(20) sex varchar(5) nation varchar(20) telephone varchar(15) mobile varchar(15) email varchar(30) address varchar(15) road varchar(20) suburb varchar(20) district varvchar(20) province varchar(20) country varchar(15) postcode varchar(15) statid int(2)

ตารางที่ 4-2 student

เก็บข้อมูลต่างๆ ของนักเรียน

18

Field_name Data type

proid(PK) int(2) not null proname varchar(10)

ตารางที่ 4-3 program

เก็บข้อมูลชนิดหลักสูตร

Field_name Data type cid(PK) bigint(20) not null proid int(2) stdid bigint(20)

ตารางที่ 4-4 choose

เป็นตารางที่เชื่อมความสัมพันธ์แบบ many to many ของ student กับ program

Field_name Data type qualid(PK) int(5) not null school varchar(20) country varchar(20) year varchar(5) gpa float

ตารางที่ 4-5 acadequal

เก็บข้อมูลเกี่ยวกับโรงเรียน ปีที่จบการศึกษา Field_name Data type

awardid(PK) int(5) not null awardname text

ตารางที่ 4-6 acadeaward

เก็บข้อมูลเกี่ยวกับรางวัลที่ได้รีบระหว่างศึกษา

19

Field_name Data type docid (PK) int(11) not null stdid int(5) typeid int(3) path varchar(50)

ตารางที่ 4-7 upload

เก็บต าแหน่งของเอกสารการสมัครเรียน

Field_name Data type typeid(PK) int(3) not null typename varchar(20)

ตารางที่ 4-8 doctype

เก็บชนิดของเอกสารที่ใช้ในการสมัคร Field_name Data type

stdid(PK) int(5) not null pname varchar(40) pnumber int(20) pcountry varchar(20) pissue date pexpire date

ตารางที่ 4-9 passport

เก็บข้อมูล passport (ถ้ามี) Field_name Data type

statid(PK) int(2) not null statname varchar(25)

ตารางที่ 4-10 stat

เก็บข้อมูลสถานะการสมัคร

20

4.3.3 E-R Diagram

รูปที่ 4-6 แผนภาพ E-R Diagram

4.3.4 การเชื่อมความสัมพันธ์ (Relationship)

1 1

รูปที่ 4-7 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ member

นักเรียน 1 คนมี account ได้ 1 member

Member 1 member เป็นของนักเรียน 1 คน

student is member

21

1 1

รูปที่ 4-8 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ passport

นักเรียน 1 คนมีได้ 1 passport

Passport 1 อัน เป็นของนักเรียน 1 คน

1 1

รูปที่ 4-9 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ acadequal

นักเรียน 1 คนมี 1 academic qualification

Academic qualification 1 อันเป็นของนักเรียน 1 คน

1 1

รูปที่ 4-10 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ acadeaward

นักเรียน 1 คนมีได้ 1 academic award

Academic award 1 อัน เป็นของนักเรียน 1 คน

1 1

รูปที่ 4-11 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ stat

นักเรียน 1 คนมีได้ 1 สถานะการสมัคร

สถานะสมัคร 1 สถานะ เป็นของนักเรียน 1 คน

student passport

student acadequal

student acadeaward

have

have

student stat have

have

22

M M

รูปที่ 4-12 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ program

นักเรียน 1 คนสมัครเรียนไดห้ลาย program

Program 1 หลักสูตร ถูกสมัครโดยนักเรียนหลายคน

1 1

รูปที่ 4-13 แผนภาพแสดงความสัมพันธ์ระหว่าง student กับ upload

นักเรียน 1 คนมีได้ 1 upload document

upload document 1 อัน เป็นของนักเรียน 1 คน

1 M

รูปที่ 4-14 แผนภาพแสดงความสัมพันธ์ระหว่าง upload กับ doctype

Upload document 1 เอกสาร มีหลายชนิด

ชนิดของเอกสารหลายชนิดอยู่ในเอกสารต่อ 1 upload

student program

student upload

upload doctype type

manage

choose

23

5. ผลการด าเนินโครงงานและวิจารณ ์

5.1 ส่วนแสดงข่าวสารของเว็บไซต์

เนื่องจากโครงการ IUP ต้องมีข่าวสารต่างๆ และหน้าเว็บสามารถแสดงข่าวสารทั้งหัวข้อ รูปภาพ และข้อความได้

รูปที่ 5-1 ส่วนแสดงข่าวสาร

5.2 ส่วนของการ Search

ในเว็บไซต์ประกอบไปด้วยหลาย Page ดังนั้นการมี search box จึงเป็นประโยชน์อย่างมาก ทดสอบโดยการใส่ค าว่า Admission

รูปที่ 5-2 ส่วนการ search ข้อมูล

ผลการทดสอบการใส่ค าว่า Admission ลงใน search box เป็นไปตามต้องการได้ข้อมูลที่มีความเกี่ยวข้องกับ Admission

24

5.3 Menu

รูปที่ 5-3 Menu

เว็บไซต์นี้เป็นเว็บที่มีเมนูอยู่ด้านซ้ายเท่านั้นเป็น menu แนวตั้งและสามารถแสดง child-page ในเมนูได้โดยทดสอบจากการคลิกท่ี study จะเห็นว่ามี child-page และข้ึนต่อไปจะเป็นการคลิกที่ Undergraduate เพ่ือทดสอบว่าสามารถแสดง child-page ได้หรือไม่

รูปที่ 5-4 child-page

ผลประกฎว่าสามารถแสดง child-page ได้อย่างถูกต้อง

25

5.4 ส่วนของระบบสมัครเรียน

5.4.1 การ login ดูข้อมูลในส่วนของ admin

รูปที่ 5-5 หน้า login

รูปที่ 5-6 หน้า admin

การท างานของระบบสมัครเรียนในส่วนของ admin ท างานได้อย่างถูกต้อง

26

5.4.2 การสมัครส่วนของ user

ในส่วนของการสมัครเรียน กรอกข้อมูลและอัพโหลดเอกสารและน่าพอใจสามารถสมัครและใช้งานได้ถูกต้อง

27

6. สรุปผลการด าเนินงานและข้อเสนอแนะ

6.1 ข้อสรุป

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

ผู้จัดท าโครงงานจึงได้สร้างเว็บไซต์ข้ึนมาใหม่เพราะสามารถท าได้ง่ายกว่าการแก้ไขเว็บไซต์เก่าอีกท้ังยังต้องเพ่ิมระบบการสมัครเรียนออนไลน์

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

6.2 ปัญหาและอุปสรรค

เนื่องจากการเขียนเว็บไซต์นั้นต้องสามารถให้อุปกรณ์หรือโปรแกรมแสดงผลต่างๆนั้น สามารถแสดงผลออกมาได้อย่างถูกต้อง ต้องท าให้เปิดได้ทั้งใน Tablet และ SmartPhone หรือโปรแกรม Web Browser ต่างๆ ให้แสดงผลตรงกันจึงต้องมีความรอบคอบในการท าเว็บไซต์

6.3 แนวการการพัฒนาต่อ

การพัฒนาต่อสามารถพัฒนาในส่วนของ User Interface ให้มีความสวยงาม ทันสมัย และถูกต้อง

สามารถเพ่ิมระบบกระจายข้อมูลข่าวสารผ่าน โปรแกรม Line ซึ่งเป็นโปรแกรม Chat ที่นิยมที่สุด ณ เวลาที่ท าโครงงานนี้

28

7. บรรณานุกรม

1) http://www.codingbasic.com/html.html [1] 2) http://www.gotoknow.org/posts/428663? [2] 3) http://www.mindphp.com/คู่มือ/73-คืออะไร/2193-css-คืออะไร.html [3] 4) http://www.softwaresiam.com/index.php/access/11-sql [4] 5) http://www.wordpress.in.th/wordpress-article/wordpress-คืออะไร [5] 6) http://bombik.com/node/81/%E0%B8%A7%E0%B8%B4%E0%B8%98%E0%B8%B5%E

0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%A5%E0%B8%87%E0%B9%82%E0%B8%9B%E0%B8%A3%E0%B9%81%E0%B8%81%E0%B8%A3%E0%B8%A1-appserv-%E0%B9%81%E0%B8%A5%E0%B8%B0-wordpress [6]

http://www.gotoknow.org/posts/428663

http://www.mindphp.com/คู่มือ/73-คืออะไร/2193-css-คืออะไร.html

http://www.softwaresiam.com/index.php/access/11-sql%20%5b4

http://www.wordpress.in.th/wordpress-article/wordpress-คืออะไร%20%5b5

http://bombik.com/node/81/%E0%B8%A7%E0%B8%B4%E0%B8%98%E0%B8%B5%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%A5%E0%B8%87%E0%B9%82%E0%B8%9B%E0%B8%A3%E0%B9%81%E0%B8%81%E0%B8%A3%E0%B8%A1-appserv-%E0%B9%81%E0%B8%A5%E0%B8%B0-wordpress




29

8. ภาคผนวก

ภาคผนวก ก คู่มือการติดตั้ง

การติดตั้งเครื่องมือ

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

8.1 การติดตั้งและใช้งาน Appserv เบื้องต้น

1) ดับเบ้ิลคลิกท่ีไฟล์เพ่ือ Install โปรแกรม

รูปที่ 8-1

2) คลิก Next


30

3) คลิก I Agree


4) เลือกโฟลเดอร์ที่จะเก็บโปรแกรมดังนั้นคลิก Next


31

5) เลือก package ทั้งหมดจากนั้น คลิก Next


6) พิมพ์ Server Name ตอนนี้เราท าในเครื่องใส่ localhost พิมพ์ Email ของ Admin Port 80 เป็นค่า Default อยู่แล้ว จากนั้นคลิก Next


32

7) พิมพ์ Password ของ root (ตั้งเอง) และใส่ซ้ าอีกรอบด้านล่าง

Character Sets and Collations เป็น UTF-8-Unicode จากนั้นคลิก Install


8) รอจนกว่าจะลงโปรแกรมเสร็จ


33

9) จากนั้นเมื่อลงโปรแกรมเสร็จ จะ Start Apache กับ Start MySQL เมื่อคลิก Finish


10) ในการใช้งานครั้งต่อๆ ไปการ Start Apache กับ Start MySQL ท าได้โดยการไปที่

Start > All Programes > AppServ > Control Server by Service


34

11) จากนั้นเปิดหน้าต่าง Browser พิมพ์ Localhost แล้ว Enter จะเข้ามาหน้าดังภาพ

คลิกท่ีลิ้งค์ phpMyAdmin Database Manager Version... เพ่ือเข้าไปสร้าง Database


12) เมื่อคลิกตามลิ้งค์ด้านบน จะให้ใส่ User Name(ใส่ root) และ Password(ที่เราตั้งไว้) แล้วคลิก OK


13) เมื่อเข้ามาแล้วให้ ไปที่ Create new database


35

14) ใส่ชื่อ Database ที่ต้องการ (แล้วแต่เราจะตั้ง) เลือก utf8_unicode_ci แล้วคลิก Create



15) จากนั้นไปเปิดโฟลเดอร์ AppServ ในไดร์ฟ C:


36

16) เข้าโฟลเดอร์ www


17) ในโฟลเดอร์จะมีไฟล์ index.php อยู่ ให้ rename เพ่ือป้องกันการเขียนทับ เวลาเรา Copy ไฟล์มา

จากโฟลเดอร์ Wordpress


37

8.2 การติดตั้ง Wordpress

1) wordpress เวอร์ชั่นล่าสุด คือ wordpress 2.7.1 ไฟล์ที่ Download มาจะเป็นไฟล์ .zip

Extract ไฟล์ zip จะได้โฟลเดอร์ wordpress


2) เปิดโฟลเดอร์ wordpress และ Copy ทุกไฟล์ในโฟลเดอร์ไปใส่ในโฟลเดอร์ C:\AppServ\www


38

3) ย้ายไฟล์ทุกไฟล์มาท่ีโฟลเดอร์ www


4) ในโฟลเดอร์จะมีไฟล์ readme.html ให้อ่าน หากต้องการความช่วยเหลือ ในภาพเป็นวิธีการ Install


39

5) ในโฟลเดอร์ www จะมีไฟล์ wp-config-sample.php เปิดไฟล์ขึ้นมาแก้ไข (อาจจะเปิดด้วย

Notepad)


40

6) แก้ไข 4 จุดคือ ใส่ชื่อ Database ที่เข้าไปสร้างไว้ ใส่ username เป็น root ใส่ password ที่ตั้งไว้

ใส่ hostname เป็น localhost(ตามท่ีได้ตั้งไว้ตั้งแต่ต้น)


7) กรอกข้อมูลต่างๆ ให้ครบ


41

8) จากนั้น Save as ไฟล์เปลี่ยนชื่อเป็น wp-config.php


9) จากนั้นเปิดหน้าต่าง Browser พิมพ์ Localhost แล้ว Enter จะเข้ามาหน้าดังภาพ


42

10) พิมพ์ชื่อ Blog ตามแต่จะตั้ง(แก้ไขได้ในภายหลัง) พิมพ์ Email Address (อะไรก็ได้ตามรูปแบบอีเมล์)

แค่ทดลองไม่ต้องใช่เมล์จริงก็ได้ จากนั้นคลิก Install Wordpress


11) เมื่อลงเสร็จ (มันจะเร็วมาก) จะขึ้นหน้า username password มา ให้ copy password ไว้ แล้ว

คลิก Log In


43

12) เมื่อเข้ามาหน้านี้ กรอก username และ password ที่ copy มาแล้วคลิก Log in


ที่มา [6]

44

9. ประวัตินิสิต

ชื่อ-นามสกุล นายอัครพงษ์ กาญจนอ าพล เลขประจาตัวนิสิต 50056290

ภาควิชาวิศวกรรม คอมพิวเตอร์ คณะวิศวกรรมศาสตร์ มหาวิทยาลัยเกษตรศาสตร์

ที่อยู่ปัจจุบัน 37/98 ถ.บ้านปากแรต ต.บ้านโป่ง อ.บ้านโป่ง จ. ราชบุรี 70110

โทรศัพท์ ที่บ้าน 032-201575 โทรศัพท์เคลื่อนที่ 089-230-1135

E-mail [email protected]

ระดับการศึกษา:

คุณวุฒิการศึกษา จากโรงเรียน/สถาบัน ปีการศึกษาที่จบ

มัธยมศึกษาตอนปลาย โรงเรียนสวนกุหลาบวิทยาลัย 2549

มัธยมศึกษาตอนต้น โรงเรียนสวนกุหลาบวิทยาลัย 2546

Documents

International Undergraduate Program Website Development … · 2013-04-01 · iv Akarapong Kanchana-ampol Web Application for International Undergraduate Program Bachelor Degree in