การติดต้ัง AppServ (PHP แอพพลิเคชั่นเซิร์ฟเวอร์) · Microsoft Internet Explorer หรือ Netscape Navigator เวอร์ชนั่

การตดตงโปรแกรมและเครองมอส าหรบเขยนเวบแอพพลเคชน 1

การตดตง AppServ (PHP แอพพลเคชนเซรฟเวอร)

โปรแกรม AppServ เปน Web Server Utility ทรวบรวม Open Source Software หลายอยางไวดวยกน เชน Web Server, PHP Interpreter, Database เพอความสะดวกในการตดตงแทนการทจะตองตดตงโปรแกรมทละสวน ส าหรบ AppServ จะชวยจ าลองเครองคอมพวเตอรใหเปน Web Server บนระบบปฏบตการ Windows ซงในชดตดตง AppServ ประกอบดวยโปรแกรม 4 ตวดงตอไปน

Apache ส าหรบท าหนาทเปนเวบเซรฟเวอร PHP ส าหรบท าหนาทเปนตวแปรภาษา PHP MySQL ส าหรบท าหนาทเปนดาตาเบสเซรฟเวอร phpMyAdmin ส าหรบท าหนาทเปนโปรแกรมบรหารจดการฐานขอมลของ MySQL

ส าหรบการตดตงโปรแกรม AppServ (PHP แอพพลเคชนเซรฟเวอร) ผใชสามารถดาวนโหลดโปรแกรม AppServ ไดทวไปจากเวบไซต เชน http://www.appservnetwork.com หรอ http://appserv.sourceforge.net เปนตน การตดตงโปรแกรม AppServ ในเอกสารเลมนผเขยนใชรน appserv-win32-2.5.10 ซงเปนรนทตดตงและใชงานงายอกรนหนง และในเอกสารเลมนผเขยนไดใชรนเปนตวอยาง จงแนะน าใหผใชตดตงนไปกอนจะไดมหนาจอและตวอยางทตรงกน

ตวอยาง เวบไซต http://www.appservnetwork.com ส าหรบดาวนโหลดชดตดตง AppServ

http://appserv.sourceforge.net/


ขนตอนการตดตงโปรแกรม AppServ

1. คนหาไฟล Appserv-win32-2.5.10 ทดาวนโหลดหรอคดลอกมาเกบไวในเครองคอมพวเตอร จากนนให ดบเบลคลกไฟล Appserv-win32-2.5.10 และคลกปม Next ตามล าดบ

2. แสดง AppServ 2.5.10 - License Agreement เปนขอความแสดงลขสทธ GNU LESSER เมออานและ เขาใจลขสทธนแลว กใหคลกปม I Agree


3. ก าหนด Directory ทตองการตดตง AppServ เมอก าหนดเสรจเรยบรอยแลว กใหคลกปม Next และหาก ตองการเปลยน Directory ในการตดตงใหเลอกปม Browse… แนะใหตดตงตามตวอยางไปกอน

4. เลอกสวนประกอบของ AppServ ทตองการตดตงโปรแกรม โดยทวไปโปรแกรมจะถกเลอกมาอยแลว คลกปม Next แนะน าใหเลอกตามตวอยางไปกอน


5. ก าหนดรายละเอยดของโปรแกรมเวบเซรฟเวอร Apache โดยตงคาระบบ ดงน

Server Name ชอ Host ใหก าหนดเปน localhost ไปกอน

Administrator's Email Address อเมลของผดแลระบบ เชน [email protected]

Apache HTTP Port ชอพอรตเปนทางออกของขอมล Apache จะมพอรต Default คอ 80

6. ก าหนดรหสผานของผดแลระบบส าหรบเขาใชงานฐานขอมล MySQL ดงน

Enter root password : กรอกรหสผานของผดแลระบบ (ใส root ไปกอน) Re-enter root password : กรอกรหสผานอกครง (ใส root อกครง) Character Sets and Collations : เลอกการเขารหสภาษา ในทนคอ UTF-8 Unicode ซงเปน

รหสภาษาสากล Old Password Support : เพอรองรบกบการเขารหสผานแบบเกา Enable InnoDB : เพอใหรองรบฐานขอมลแบบ InnoDB


เมอก าหนดรายละเอยดของโปรแกรมเวบเซรฟเวอร Apache และตงคาระบบเสรจเรยบรอยแลวใหคลกปม Install เพอด าเนนการขนตอนตอไป

7. ชดตดตงโปรแกรม AppServ จะแสดงความกาวหนาของการตดตงโปรแกรมไปจนกระทงเสรจสน และ ในขณะท าการตดตงหากตองการดรายละเอยดไฟลทตดตงใหคลกปม Show details


8. ชดตดตงโปรแกรม AppServ แสดงขอความตดตงโปรแกรมเสรจเรยบรอยแลว ขนตอนนใหคลกปม Finish เพอสนสดการตดตงโปรแกรม

หมายเหต

หากเราเลอก Start Apache และ Start MySQL เมอเปดเครองคอมพวเตอรขนโปรแกรม Apache เวบเซรฟเวอร และ MySQL Database Server จะท างานโดยอตโนมต แนะน าใหด าเนนตามตวอยางไปกอน

การเรมตนใชงานโปรแกรม AppServ

โดยปกตเมอเปดเครองคอมพวเตอรโปรแกรม Apache เวบเซรฟเวอรและ MySQL ดาตาเบสเซรฟเวอรจะท างานโดยอตโนมตตามทกลาวมาแลวขางตน แตหากโปรแกรมไมท างานสามารถสงใหเรมตนท างานไดโดยวธการ ดงน

ขนตอนการเรมตนใชงาน (Start)

1. การรน Apache เวบเซรฟเวอร โดยคลกทเมน ดงน Start > Programs > AppServ > Apache Control Server by Manual > Apache Start

2. การรน MySQL ดาตาเบสเซรฟเวอร โดยคลกทเมน ดงน Start > Programs > AppServ > Apache Control Server by Manual > MySQL Start


การหยดใชงานโปรแกรม AppServ

หากตองตองการหยดการท างานของโปรแกรม Apache เวบเซรฟเวอร และ MySQL ดาตาเบสเซรฟเวอร สามารถสงใหหยดท างานได โดยวธการ ดงน

ขนตอนการหยดใชงาน (Stop)

1. หยดการท างาน Apache เวบเซรฟเวอร โดยคลกทเมน ดงน Start > Programs > AppServ > Apache Control Server by Manual > Apache Stop

2. หยดการท างาน MySQL ดาตาเบสเซรฟเวอร โดยคลกทเมน ดงน Start > Programs > AppServ > Apache Control Server by Manual > MySQL Stop

การ Reset MySQL root password

หากเราลมรหสผานหรอตองการเปลยนรหสผาน MySQL Database Server ของผ ดแลระบบใหมสามารถ ด าเนนการได โดยคลกทเมน ดงน

1. คลกเลอกทเมน ดงน Start > Programs > AppServ > Reset MySQL root password

2. โปรแกรมแสดงหนาจอใหกรอกรหสผานใหม ดงน

การลบโปรแกรม AppServ

หากเราตองการลบโปรแกรม AppServ ออกจากเครองคอมพวเตอรทตดตงเราสามารถท าได โดยไปคลกทเมน ดงตอไปน

1. Start > Programs > AppServ > Uninstall AppServ v.2.510


ทดสอบการใชงาน AppServ

เมอตดตงโปรแกรม AppServ เสรจเรยบรอยแลว ขนตอนตอไปเปนการทดสอบการใชงาน AppServ ดวาใชงานไดหรอไม โดยเปดเวบเบราเซอรขนมาแลวพมพในชอง URL เรยกไปท http://localhost หรอ http://127.0.0.1 กได หากปรากฏหนาจอตามตวอยางแสดงวาใชงานได

การเตรยม Folder ส าหรบเขยนโปรแกรม

การเตรยม Folder ส าหรบเขยนโปรแกรมเปนการสราง Folder ขนมาเพอจดเกบโปรแกรมหรอไฟลทเกยวกบการเขยนโปรแกรม ซงไมถอวาเปนมาตรฐานการเขยนโปรแกรม แตควรจะมการเตรยม Folder ไวใหเปนสดสวนเพอไมใหปะปนกบไฟลอนและงายคนหาเรยกใชงาน และในเอกสารเลมนผเขยนไดเตรยม Folder ไวส าหรบเขยนโปรแกรม โดยใหผศกษาสรางตามตวอยาง ดงน

1. เขาไปท C:\AppServ\www 2. สราง Folder ชอวา csmat 3. เขาไปท C:\AppServ\www\csmat และสราง Folder จ านวน 4 Folder ดงน

css ส าหรบจดเกบไฟล css function ส าหรบจดเกบไฟล function images ส าหรบจดเกบไฟลรปภาพ source ส าหรบจดเกบไฟล source code

4. ผศกษาอาจสราง Folder ขนมาอกไดตามความจ าเปน เชน document เอาไวเกบไฟลเอการ เปนตน

http://localhost/

http://127.0.0.1/


การตดตงโปรแกรม Macromedia Dreamweaver MX 2004

Macromedia Dreamweaver MX คอ ชดโปรแกรมประเภท HTML Editor ทใชส าหรบการออกแบบและพฒนาเวบแอพพลเคชน ซงสามารถสรางโคด HTML รวมทงภาษา Script อกมากมาย เชน Action Script, CSS, JavaScript, XML, ASP JavaScript, ASP VBScript, ASP.NET C#, ASP.NET VB, JSP และภาษา PHP เปนตน ซงผใช สามารถดาวนโหลดชดทดลองไดทเวบไซต http://www.macromedia.com มาตดตงทเครองคอมพวเตอร เพอฝกใชงานไปกอน ส าหรบโปรแกรม Macromedia Dreamweaver MX ตวนจะชวยใหสามารถเรยกใชงาน PHP ผานทางเวบเบราเซอร แตจะตองท าการตดตงโปรแกรมเพอท าการเชอมตอกบ PHP MySQL กอน ส าหรบเครองคอมพวเตอรทจะตดตงโปรแกรม Macromedia Dreamweaver MX ควรจะมคณสมบต ดงน

เครองคอมพวเตอร CPU Pentium III 600 MHz ขนไป ระบบปฏบตการ Windows 98, Windows 2000, Windows XP หรอ Windows Server 2003 Microsoft Internet Explorer หรอ Netscape Navigator เวอรชน 4 ขนไป หนวยความจ าขนาดไมต ากวา 128 MB แตแนะน าวาควรเปน 256 MB Hard disk มพนทวางไมต ากวา 275 MB ขนไป จอภาพแสดงผลได 256 สขนไป ความละเอยด 800X600 พกเซล ขนไป

ตวอยาง แสดงหนาจอโปรแกรม Macromedia Dreamweaver MX 2004

http://www.macromedia.com/


ขนตอนการตดตงโปรแกรม Macromedia Dreamweaver MX 2004

1. คนหาไฟลชดตดตงโปรแกรมจากซดรอมหรอคดลอกมาเกบไวในเครองคอมพวเตอร จากนนใหดบเบล คลกไฟลชด ตดตง Setup.exe และคลกปม Next ตามล าดบ

2. แสดงหนาจอตอนรบการตดตงโปรแกรม Macromedia Dreamweaver MX 2004 ในขนตอนนให คลก ปม Next


3. แสดง Macromedia Dreamweaver MX 2004 - License Agreement เปนขอความแสดงลขสทธ เมออาน และเขาใจลขสทธนแลว ใหคลกปม Yes

4. ก าหนด Directory ทตองการตดตง Macromedia Dreamweaver MX 2004 เมอก าหนดเสรจ เรยบรอยแลว ใหคลกปม Next และหากตองการเปลยน Directory ในการตดตงใหเลอกปม Browse…


5. เลอกสวนประกอบของ Macromedia Dreamweaver MX 2004 ทตองการตดตงโปรแกรม โดยทวไป โปรแกรมจะถกเลอกมาอยแลว เลอกเสรจแลวคลกปม Next

6. ชดตดตงโปรแกรมเรมคดลอกไฟลสวนประกอบของ Macromedia Dreamweaver MX 2004 ลงในเครอง คอมพวเตอรตามต าแหนง Directory ทก าหนด จากนนใหคลกปม Next


7. แสดงความกาวหนาในการตดตงโปรแกรม Macromedia Dreamweaver MX 2004 รอไปจนกวาจะ ตดตงโปรแกรมเสรจ

8. คลกปม Finish เพอสนสดขนตอนของการตดต งโปรแกรม Macromedia Dreamweaver MX 2004 เปนอนวาตดตงเรยบรอย


การเชอมตอโปรแกรม Macromedia Dreamweaver MX 2004 กบ PHP MySQL

การเชอมตอโปรแกรม Macromedia Dreamweaver MX 2004 กบ PHP MySQL จะชวยใหสามารถเรยกใชงาน PHP ผานทางเวบเบราเซอรและสรางการตดตอกบฐานขอมล MySQL ไดอยางอตโนมต ดงน

1. เปดโปรแกรม Macromedia Dreamweaver MX 2004 โดยคลกทเมน Start > Programs > Macromedia Dreamweaver MX 2004

2. เชอมตอ Macromedia Dreamweaver MX 2004 เขากบ PHP MySQL โดยไปคลกทเมน Site > Manage Sites > New > Site


3. ก าหนด Site Name : csmat ผใชจะตองก าหนด Site Name ใหตรงตาม Folder ทไดสรางไวกอนหนาน แลว C:\AppServ\www\csmat\ > ก าหนดตามตวอยาง

4. เลอก Yes, I want to use a server technology > ไปท which server Technology? > จากนนเลอก PHP MySQL > คลกปม Next


5. เลอกท Edit locally, then upload to remote testing server > Where on your computer do you want to store your file? > เลอก C:\AppServ\www\csmat\ > คลกปม Next

6. ไปท How do you connect to your testing server? > เลอก Local/Network > ไปท Where do you copy your files to in order to test them? > เลอก C:\AppServ\www\csmat > คลกปม Next


7. ไปท What URL would you use to browse to the root of your site? > พมพ http://127.0.0.1/csmat/ หรอ http://localhost/csmat/ > คลกปม Test URL > แสดงขอความ The URL Prefix test was successful. > คลกปม OK และปม Next ตามล าดบ

8. เลอก No, do not enable check in and check out > คลกปม Next

http://127.0.0.1/csmat

http://localhost/csmat/


9. โปรแกรมสรปรายละเอยดของ Site และการก าหนดคาของเวบเซรฟเวอร > คลกปม Done

10. โปรแกรมแสดงรายละเอยดของไฟลใน C:\AppServ\www\csmat โดยจะปรากฏรายละเอยดของไฟลและ Folder ตามตวอยาง ดงภาพดานลาง


การเรยกใชงานโปรแกรม Macromedia Dreamweaver MX 2004

1. เป ด โป รแก รม Macromedia Dreamweaver MX2004 โด ย ไป ค ล ก ท เม น Files > News > เล อ ก Category: Dynamic page: PHP -> คลกปม Create ตามล าดบ

2. ก าหนดรหสภาษาไทยของ New Document โดยไปทเมน Edit > Preferences > Category > เลอก New Document > Default document type: เลอก PHP > Default encoding: เลอก Unicode (UTF-8)


3. ก าหนด Font ใหรองรบรหสภาษาไทย โดยไปทเมน Edit > Preferences > Category > Fonts > Font setting: Unicode >Proportional font: เลอกประเภทและขนาดของ Font > Fixed font: เลอกประเภทและ ขนาดของ Font > Code view: เลอกประเภทและขนาดของ Font > คลกปม OK

4. เขยนโปรแกรมเพอแสดงขอความ “Hello World !” โดยพมพค าสงตามตวอยางดานลาง จากนนบนทก ไฟลชอวา hello.php เกบไวใน C:\AppServ\www\csmat\

เขยน code ตรงน

ก าหนดรหสภาษาไทย utf-8


5. ทดสอบรนดผลลพธโปรแกรม โดยเปดเวบเบราเซอรขนมาเรยกไปท http://127.0.0.1/csmat/hello.php หรอ http://localhost/csmat/hello.php หรอกดปมฟงกชน F12

แบบฝกหดทายบท

1. เขยนโปรแกรมแสดงขอมลนกศกษา ซงประกอบดวย รหสนกศกษา ชอ -สกล สาขาวชา ทอยของนกศกษา และเบอรโทรศพทของนกศกษา โดยมรายละเอยด ดงน

แตละรายการใหอยคนละบรรทดกน ตวอกษรเปนตวหนา ตวเอยง และมสน าเงน บนทกไฟลชอวา student.php เกบไวใน C:\AppServ\www\csmat\ ทดสอบรนดผลลพธโปรแกรม

2. เขยนโปรแกรมใหแสดงผลลพธ ดงตอไปน

บนทกไฟลชอวา subject.php เกบไวใน C:\AppServ\www\csmat\ ทดสอบรนดผลลพธโปรแกรม

http://127.0.0.1/csmat/hello.php

http://localhost/csmat/hello.php

Documents

การติดต้ัง AppServ (PHP แอพพลิเคชั่นเซิร์ฟเวอร์) · Microsoft Internet Explorer หรือ Netscape Navigator เวอร์ชนั่