การสร้างเว็บไซต์ด้วยชุดเว็บสำเร็จรูป CMS จำเป็นจะต้องมีการจำลองเซิร์ฟเวอร์ในเครื่องของเราเองก่อน เพื่อทำการทดสอบปรับแต่ง แก้ไขให้ตรงใจก่อนการนำขึ้นสู่เครื่องแม่ข่ายจริง ดูผลแบบเว็บไซต์จริง เซิร์ฟเวอร์จำลองสามารถทำได้ด้วยหลากหลายโปรแกรมทั้ง MS IIS, Appserv ที่เคยแนะนำไปแล้ว วันนี้จะขอเสนออีกตัวคือ Xampp เพราะตัวนี้มีการทำชุดติดตั้งทั้งบนระบบปฏิบัติการวินโดว์ ลีนุกซ์ และแม็คโอเอสด้วย ในที่นี้แนะนำตัวติดตั้งบนลินุกซ์ครับ
ท่านสามารถไปหาความรู้เพิ่มเติมเรื่อง Xampp ได้จากเว็บไซต์ผู้พัฒนาที่ www.apachefriends.org พร้อมทั้งดาวน์โหลดตัวติดตั้งมาได้เลยครับ
จะเห็นว่า Xampp นั้นพัฒนามาให้ใช้ได้ทั้งบน Windows, Linux, OS X ก็เลือกดาวน์โหลดมาใช้งานกันได้ตามเครื่องที่ท่านใช้งานว่า เป็นระบบปฏิบัติการใด ในที่นี้ผมขอเสนอการติดตั้งเวอร์ชั่นบนลินุกส์ Ubuntu 18.04 LTS ครับ (สำหรับเหล่าทวยเทพที่เบื่อหน้าต่างแล้วหันไปคบฝั่งโอเพ่นซอร์สกัน)
- ให้ทำการดาวน์โหลดไฟล์ติดตั้งเวอร์ชั่นล่าสุดมานะครับ xampp-linux-x64-7.3.3-1-installer.run (ณ วันที่เขียนบทความนี้เป็นเวอร์ชั่น 7.3.3 แล้ว) ขนาด 137MB เน็ตเร็วสมัยนี้ใช้เวลานิดเดียว
- ไฟล์ที่ดาวน์โหลดมาจะถูกบันทึกไว้ที่โฟลเดอร์ Downloads (ตามภาพประกอบนี้มาจาก Ubuntu 18.04 LTS ในเครื่องผมเองครับ)
- การติดตั้งบนลีนุกส์เราจะใช้ Command Line (คำสั่งแบบ Text บน Terminal นะครับ เพราะสะดวกในการกำหนดสิทธิเข้าถึงไฟล์ ถ้าในวินโดว์ก็คงเป็นแบบ Run as Administrator นั่นเอง)
- เริ่มต้นที่เข้าไปในโฟลเดอร์ดาวน์โหลดก่อนด้วยคำสั่ง cd Downloads กดปุ่ม Enter (คำสั่ง cd ก็คือ change directory นั่นเอง)
- ตรวจดูว่ามีไฟล์ที่เรามาติดตั้งไหม ชื่ออะไร ด้วยคำสั่ง ls กด Enter (คำสั่ง ls ก็คือ list แสดงรายชื่อไฟล์) จะเห็นชื่อไฟล์ xampp-linux-x64-7.3.3-1-installer.run
- กำหนดสิทธิให้เขียนเปลี่ยนแปลงไฟล์ได้ก่อนเพราะเราดาวน์โหลดมา ด้วยคำสั่ง chmod 755 xampp-linux-x64-7.3.3-1-installer.run
- ตามด้วยคำสั่งติดตั้งด้วยสิทธิแอดมินหรือ root เป็น sudo ./xampp-linux-x64-7.3.3-1-installer.run
- จะปรากฏหน้าต่างติดตั้งให้ใช้เมาส์คลิกได้แล้วตอนนี้ เริ่มง่ายล่ะ คลิก Next > ซิจ๊ะ
- จะพบหน้าต่างบอกว่าจะทำการติดตั้งไฟล์ระบบหลักๆ ของ Xampp และไฟล์สำหรับการพัฒนาต่อยอดล่ะนะ คลิก Next >
- ตัวติดตั้งบอกว่าจะติดตั้งไฟล์ทั้งหมดไว้ที่ /opt/lampp นะจ๊ะ (จะได้หาถูกจ้า) คลิก Next >
- ตัวติดตั้งนี้พัฒนาโดยทีมชื่อว่า Bitnami for Xampp ซึ่งเขายังมีชุดติดตั้งสำเร็จรูป CMS เจ้าดังอย่าง Wordpress, Drupal, Joomla! ด้วยนะ ถ้าสนใจก็คลิกที่ลิงก์นี้ดูนะ https://bitnami.com/xampp คลิก Next >
- พร้อมที่จะติดตั้งแล้วจ้า คลิก Next > โลดเด้อ
- เริ่มกระบวนการติดตั้งก็นั่งรอไปสิจ๊ะ
- เสร็จแล้วจ้า ระบบของ XAMPP จะเริ่มทำงานแล้วนะ คลิก Finish ได้แล้วจ้า
- หน้าต่างของพี่ XAMPP 7.3.3-1 มาแล้ว พร้อมใช้งาน แต่ตรวจสอบหน่อยไหมว่าทำงานถูกต้องหรือยัง คลิกที่ปุ่ม Go to Application
- จะมาที่หน้าต่างโปรแกรม ตรวจดูที่แท็ป Manage Servers จะเห็นว่า Apache Web Server ทำงานแล้ว ตรวจดู Port ทำงานที่ปุ่ม Configure ถ้าเป็น 80 ถูกต้อง คลิก OK
- คลิกที่ MySQL Database ดูว่าทำงานหรือยัง ตรวจสอบ Port อีกที่ที่ปุ่ม Configure เจอ 3306 ถูกต้อง กดปุ่ม OK
- คลิกกลับไปที่แท็บ Welcome แล้วคลิกที่ปุ่ม Open Application Folder จะพบหน้าต่าง /opt/lampp ด้านล่างนี้ ไฟล์เว็บที่เราจะสร้างต้องเก็บไว้ภายในโฟลเดอร์ htdocs เท่านั้นนะ ลองคลิกดูภายในซิ
- ภายในโฟลเดอร์ /opt/lampp/htdocs นี้จะเป็นที่เก็บไฟล์เว็บทั้งหมดแบบเดียวกับที่ Appserv จะเก็บไว้ในโฟลเดอร์ www
- พบว่ามีไฟล์ index.php อยู่ในโฟลเดอร์เลยทดสอบเรียกดูหน้าเว็บผ่านบราวเซอร์โดยพิมพ์คำว่า localhost ในช่อง address ดูก็ได้ดังภาพล่างนี้
- เปิด Text Editor มาพิมพ์คำสั่งภาษา html ดังภาพ บันทึกไฟล์ในชื่อ index.html
- แล้วนำไปเก็บไว้ในโฟลเดอร์ htdocs จากนั้นลองเรียกแสดงผลดูในบราวเซอร์
- เย้! เมื่อพิมพ์คำว่า localhost ลงในช่อง address ของบราวเซอร์ สำเร็จแล้วนี่ไง...
- ทดสอบดูสิว่าฐานข้อมูลทำงานได้จริงหรือเปล่าด้วยการพิมพ์คำว่า localhost/phpmyadmin นี่ไงสำเร็จแล้วพร้อมใช้งาน (บัญชีใช้งาน ไม่มีรหัสผ่านนะต้องไปกำหนดเพิ่มเติมเอง ถ้าต้องการ)
เรียบร้อยแล้ว ขั้นตอนต่อไปคือการติดตั้งระบบ CMS ต่างๆ ในการสร้างเว็บไซต์สุดสวยต่อไป