โหลดก่อนเลย!
คุณสามารถดาว์วโหลด VS Code ลงมาใช้งานได้ฟรี ที่หน้าหลัก Microsoft ลิงค์นี้
https://code.visualstudio.com
แล้ว install กด Next เรื่อยจน install เสร็จสิ้น
การ Config PHP Debugger
ก่อนอื่นเช็คไฟล์ php.ini กันสักนิดว่าพร้อมสำหรับ Debug หรือยัง โดยผมใช้ XDebug เข้าไปตั้งค่าตามนี้
XAMPP Stack :
1. แก้ไฟล์ c:/xampp/php/php.ini ถ้ายังไม่มีโค๊ดข้างล่าง ให้เพิ่มดังนี้
[XDebug]
zend_extension="C:\xampp\php\ext\php_xdebug.dll"
xdebug.remote_host=localhost
xdebug.remote_enable=1
xdebug.remote_handler="dbgp"
xdebug.remote_port=9000
xdebug.remote_autostart = 1
2. เช็คดูว่าไฟล์ php_xdebug.dll อยู่ที่ directory ที่คุณลง xampp จริง
3. ตั้งค่า port 9000
4. ตั้งค่า xdebug.remote_enable เป็น 1
การ Config VS Code ให้มี PHP Debugger
1. เข้า command palette ไปที่ view > command palette หรือ ctrl + shift + p
2. พิมพ์ ext install
3. ค้นคำว่า php debug
4. กด install แล้ว restart VS Code ใหม่
5. ไปที่ file > preferrence > user settings ใส่ค่านี้ลงไปข้างใน ปีกกา {}
"php.validate.executablePath": "C:/xampp/php/php.exe"
มาเริ่ม Debug กัน
1. เปิด project test ขึ้นมา โดยคลิกรูปกระดาษสองแผ่นที่เมนูด้าานซ้าย
2. เปิด debug mode โดยเลือกที่รูปแมลงด้านซ้าย
3. คลิกปุ่มฟังเฟืองเพื่อ setting เเล้วเลือ PHP สังเกตว่า port เป็น 9000 แล้ว save
4. run ปุ่มสามเหลื่ยมเขียวๆ
5. เข้า browser เเล้วไปที่ project test : localhost/test/test.php
อันนี้ ไฟล์ test.php ของผม
<?php
echo "test page for vs code + PHP";
$test = 1;
$testArray = array('test1', 'test2');
foreach ($testArray as $key => $value) {
echo $value.'<br/>';
}
?>
6. ทำ break point ไว้เพียงเท่านี้ code ของท่านก็สามารถ watch ค่าตัวแปรได้เเล้ว ดังรูป
เป็นอันจบครับ Open Source จงเจริญ!
