
เมื่อพัฒนาเว็บไซต์ นักออกแบบเว็บไซต์จะต้องสามารถเห็นหน้าเว็บของเขาในลักษณะเดียวกับที่ผู้ใช้ปลายทางมองเห็นได้ บางครั้ง แค่คลิกและดูไฟล์ HTML ในเว็บเบราว์เซอร์ก็เพียงพอแล้ว แต่ถ้าคุณต้องการทดสอบเนื้อหาแบบไดนามิก คุณจะต้องตั้งค่าเว็บเซิร์ฟเวอร์ในเครื่อง การทำเช่นนี้ค่อนข้างง่ายและสามารถทำได้บน Windows, macOS และ Linux มีเว็บเซิร์ฟเวอร์หลายประเภท แต่เราใช้ Apache ในบทช่วยสอนนี้ เนื่องจากเป็นเซิร์ฟเวอร์ทั่วไป ติดตั้งง่ายมาก และเข้ากันได้กับระบบปฏิบัติการหลักทั้งหมด
ตั้งค่าเว็บเซิร์ฟเวอร์ในเครื่องบน Linux
Apache ได้รับการออกแบบมาสำหรับระบบปฏิบัติการที่เหมือนยูนิกซ์ Linux อยู่ในหมวดหมู่นี้ และการติดตั้งและการกำหนดค่าของเว็บเซิร์ฟเวอร์ Apache สามารถทำได้ในขั้นตอนเดียว
ที่นี่เราจัดการกับบรรทัดคำสั่ง การแจกแจงยอดนิยมส่วนใหญ่อนุญาตให้คุณติดตั้ง Apache โดยไม่ต้องคอมไพล์จากซอร์สโดยใช้คำสั่งง่ายๆ เพียงคำสั่งเดียว
สำหรับ distro ที่ใช้ Debian, Ubuntu และ Ubuntu:
sudo apt install apache2
สำหรับ Red Hat และ CentOS
sudo dnf install httpd
เมื่อติดตั้งแล้ว ให้ไปที่เว็บเบราว์เซอร์ของคุณไปที่ “127.0.0.1” หรือ “localhost” ถ้ามันขึ้นว่า “It Works!” นั่นหมายถึงการติดตั้ง Apache ของคุณสำเร็จ

เพื่อให้เข้าใจได้ดีขึ้นว่า Apache ให้บริการหน้าเว็บนี้อย่างไร มาแก้ไขกัน ในการดำเนินการนี้ ให้ไปที่ไดเร็กทอรีเว็บรูทของเครื่องลินุกซ์โลคัลของคุณ
cd /var/www/html
เปิด “index.html” เป็นรูทด้วยโปรแกรมแก้ไขข้อความที่คุณชื่นชอบ
ค้นหา "มันใช้งานได้!" และเปลี่ยนข้อความเป็นแบบสุ่ม เช่น "ทำให้เทคโนโลยีง่ายขึ้น!" (อาจเป็นอะไรก็ได้จริงๆ) อย่าลืมบันทึกไฟล์ไว้
ตอนนี้รีเฟรชหน้าเว็บเป็น 127.0.0.1 คุณควรเห็น “Make Tech Easer!” ที่ "มันใช้งานได้!" เคยเป็นมาก่อน

เมื่อคุณได้ตั้งค่าเว็บเซิร์ฟเวอร์อย่างง่ายแล้ว คุณสามารถเล่นกับการตั้งค่าการกำหนดค่าใน “apache2.conf”
sudo nano /etc/apache2/apache2.conf
หมายเหตุ :โปรดทราบว่าทุกครั้งที่คุณทำการเปลี่ยนแปลงการกำหนดค่า คุณจะต้องรีสตาร์ท Apache เพื่อให้ใช้งานได้
sudo systemctl restart apache2
หากไม่ได้ผล คุณสามารถรีสตาร์ทได้โดยเรียกใช้ไฟล์ upstart โดยตรง
sudo /etc/init.d/apache2 restart
ตั้งค่าเว็บเซิร์ฟเวอร์ในเครื่องบน macOS
ข้อดีของ macOS คือติดตั้ง Apache ไว้เป็นค่าเริ่มต้น สิ่งที่คุณต้องทำคือเปิดเครื่อง
ใน Finder ให้ไปที่ "Applications -> Utilities" จากนั้นดับเบิลคลิกที่ Terminal เพื่อเปิด

หากต้องการเปิดเว็บเซิร์ฟเวอร์ Apache ที่ติดตั้งไว้แล้ว ให้เรียกใช้คำสั่งต่อไปนี้:
sudo apachectl start
หากต้องการทดสอบว่าเว็บเซิร์ฟเวอร์ของเราทำงานอยู่ ให้ไปที่ “127.0.0.1” หรือ “localhost” ในเว็บเบราว์เซอร์ของคุณ

เราสามารถเปลี่ยนเนื้อหาของหน้าเว็บได้โดยไปที่รูทเอกสารแบบเดียวกับที่เราทำใน Linux สิ่งเดียวที่แตกต่างคือตำแหน่งเส้นทาง
cd /Library/WebServer/Documents/
ตอนนี้แก้ไขไฟล์ “index.html.en” โดยใช้โปรแกรมแก้ไขข้อความที่คุณชื่นชอบ เปลี่ยน "ใช้งานได้!" ไปที่ "สวัสดีชาวโลก!"
sudo nano index.html.en

หากเรารีเฟรชหน้าเว็บของเราที่โฮสต์บน 127.0.0.1 เราจะเห็นการเปลี่ยนแปลงที่สะท้อนออกมา

หากต้องการกำหนดค่าเว็บเซิร์ฟเวอร์ Apache เพิ่มเติมใน macOS ให้ไปที่ไฟล์ “httpd.conf”
sudo nano /etc/apache2/httpd.conf
เช่นเดียวกับ Linux คุณสามารถเริ่มบริการ Apache ใหม่ได้ง่ายๆ โดยใช้ apachectl
คำสั่งพร้อมสิทธิ์รูท
sudo apachectl restart
ตั้งค่าเว็บเซิร์ฟเวอร์ในเครื่องบน Windows
ต่างจาก Linux และ macOS ตรงที่ Windows ไม่ได้ใช้ Unix ดังนั้นจึงไม่มีซับในให้ติดตั้ง โชคดีที่มีวิซาร์ดการติดตั้งหลายตัวที่รวมสิ่งต่าง ๆ เช่น Apache, MySQL และ PHP เข้าด้วยกันเพื่อทำให้ชีวิตของเราง่ายขึ้น หนึ่งในนั้นคือ XAMPP
หมายเหตุ :XAMPP สามารถใช้ได้กับ Linux และ Mac OS X ด้วยเช่นกัน
ดาวน์โหลด XAMPP เวอร์ชัน Windows และเริ่มการติดตั้ง ดำเนินการติดตั้งเมื่อได้รับแจ้ง คุณสามารถเลือกเฉพาะ Apache ได้หากต้องการเพียงแค่เว็บเซิร์ฟเวอร์ อย่างไรก็ตาม หากคุณวางแผนที่จะใช้ฐานข้อมูล คุณอาจต้องการเลือก MySQL ด้วย

ดำเนินการติดตั้งต่อและคลิก "เสร็จสิ้น" เมื่อเสร็จสิ้น โดยค่าเริ่มต้น แผงควบคุม XAMPP จะถูกเปิดใช้

คลิก “เริ่ม” สำหรับ Apache และ MySQL หากจำเป็น
หากคุณไปที่ “127.0.0.1” หรือ “localhost” ในเว็บเบราว์เซอร์ คุณจะเห็นหน้าการกำหนดค่า XAMPP

ในการสร้างหน้าเว็บใหม่ ขั้นตอนจะเหมือนกัน เปิดแผ่นจดบันทึกและสร้างไฟล์ HTML ตัวอย่าง ตั้งชื่อว่า “hello.html”

บันทึกไว้ในรูทเอกสารที่อยู่ใน “c:\xampp\htdocs\”
ไปที่มันโดยใช้เว็บเบราว์เซอร์ของคุณโดยไปที่ 127.0.0.1/hello.html คุณจะสามารถเห็นหน้าเว็บที่คุณสร้างขึ้น

หมายเหตุ: WampServer เป็นอีกตัวเลือกที่ดีในการติดตั้ง Apache บน Windows
บทสรุป
Apache เป็นโซลูชันที่ยอดเยี่ยมสำหรับการสร้างเว็บไซต์ทั้งที่เรียบง่ายและซับซ้อน แต่ไม่ใช่ตัวเลือกเดียว แม้ว่า Apache จะทำงานร่วมกันได้ดีในทั้งสามแพลตฟอร์ม คุณอาจต้องการพิจารณาว่า IIS เป็นตัวเลือกสำหรับ Windows เนื่องจากสนับสนุนคุณลักษณะการรับรองความถูกต้องของ Windows มากมายที่ Apache ไม่รองรับ อย่างไรก็ตาม สำหรับการทดสอบฟังก์ชันพื้นฐานของเว็บไซต์อย่างง่าย Apache ก็สมบูรณ์แบบ