เอาใจคอ PHPStorm กันไปเลยแบบไม่ได้ตั้งใจ ที่บริษัทหลายคนชอบไช้ บทความนี้ส่วนหนึ่งเขียนขึ้นเพื่อให้พวกในบริษัทที่ผมทำงานอยู่อ่านเป็นแหล่งอ้างอิง ส่วนที่เหลือก็เผื่อแผ่ถึงท่านอื่นๆที่ใช้ ไอ้ PHPStorm เป็นอิดิเตอร์หลักพัฒนา PHP

ลำดับการตั้งค่า และสิ่งที่จะต้องติดตั้งในเครื่อง มีอยุ่ 3 ขั้นตอน

1. ต้องติดตั้ง x-debug ไว้ในเครื่องเรียบร้อยแล้ว อ่านเอาที่นี่นะ
2. ติดตั้ง extension ชื่อ easy Xdebug (with movable icon) ลงไปในไฟฟ้อก เพราะจะใช้ไฟฟ้อกเป็นตัวเรียกดูเว็บไซต์ เป็นหลัก
3. ตั้งค่าใน PHPStorm

ขั้นตอนที่ 1 เรื่องการติดตั้งปลักอิน xdebug เข้าไปอ่านในลิ้งก์ที่ให้ไว้นั่นแหละ เขียนไว้ละเอียดแล้ว เราข้ามไปขั้นตอนที่ 2 กันเลย คือติดตั้ง extension ชื่อ easy Xdebug (with movable icon)

1. คลิกเมนู Firefox เลือก Add-ons
   
2. ป้อนคำว่า xdebug เข้าไปในช่องค้นหาแล้วกดปุ่ม Enter
   
3. คลิก Install  extension easy Xdebug (with movable icon)
   
4. เมื่อติดตั้งเสร็จ จะมีปุ่มแมงตัวเขียวๆขึ้นมาที่ด้านขอบด้านล่างเบราเซอร์  เรียบร้อย ลองคลิกที่ตัวแมงนะครับ มันจะเป็นการเปิดปิดการเรียกใช้ xdebug ถ้าเป็นตัวเขียวๆอยู่ แสดงว่ายังไม่ทำงาน ให้คลิกไปทีนึง ให้เป็นตัวแมงเขียว+มีเครื่องหมายลบแดงๆติดตรงปีก
   

ต่อจากนั้นก็เข้าสู่ขั้นตอนที่ 3 คือตั้งค่า PHPStorm ให้เรียกใช้ xdebug

1.  เปิด PHPStorm ขึ้นมา คลิกขวาที่โปรเจ็ก (โปรเจ็กใดก็ได้ คลิกไปเถอะ) เลือก Debug ‘…….’
   
2. หน้าต่าง config จะเปิดขึ้นมา ถ้าด้านล่างมีเครื่องหมายตกใจ ให้คลิกปุ่ม Fix  ถ้าไม่มีก็คลิกปุ่ม Debug ได้เลย
   
3. จะมีหน้าจอเปิดขึ้นมาอีก 1 หน้าจอ ปวดหัวกับมันตรงหน้าจอมันเยอะนี่แหละ  คลิกปุ่ม … ด้านหลัง Interpreter:
   
4. จะมีหน้าจอเปิดขึ้นมาอีก 1 หน้าจอนะท่าน (มึงเปิดมาเยอะซะกูงง ทำไมไม่ใช่การแสดงผลแบบ tabs ไม่เข้าใจ) คลิกปุ่มเครื่องหมาย + ครับ บอกตามตรงว่าถ้ามันเปิดมาอีกหน้าต่างนะ จะอีเมล์ไปหาม้าก ซักเก้อเบิก เลย
   
5. มันจะมีรายการ php.exe ที่มันเจอในเครื่องเราแสดงขึ้นมาให้ดู เลือกเลยครับ  หลักๆของหน้าจอนี้ก็คือให้เรากำหนดว่าตัวรัน PHP เรานั้นอยู่ไหน ซึ่งก็คือไฟล์ php.exe นั่นเอง
   
6. ตั้ง Name ให้สื่อความหมายหน่อย เลือก Debugger  เป็น Xdebug  เสร็จแล้วคลิกปุ่ม OK
   
7. คลิก OK ออกมาเรื่อยๆ จนมาถึงหน้านี้ คลิกปุ่ม Debug
   
8. ทำ breakpoint บรรทัด ที่ต้องการดีบัก เสร็จแล้วคลิกปุ่ม Start listen PHP Debug connections คล้ายๆโทรศัพท์สีเขียวๆ
   
9. เปิดไฟฟ้อกขึ้นมา เข้าไปยังโปรเจ็กของท่าน คลิกรูปเต่าทองเขียวๆ จนมีเครื่องหมายลบติดที่ปีกเต่า จากนั้น reload หน้าเพจใหม่อีกครั้ง
   
10. ตัว PHPStorm จะกระพริบแว๊บๆ เมื่อเราเปิดไปดู จะมีหน้าต่าง xxx อะไรสักอย่างนี่แหละ ขี้เกียจอ่าน สนใจแต่ปุ่ม Accept เท่านั้น คลิกเลย
    
11. ตอนนี้เราก็ควบคุม ให้โค้ดมันรันทีละบรรทัด ตามใจเราได้แล้ว หยุดเพื่อตรวจสอบข้อมูลในตัวแปรแบบ realtime ได้แล้ว
    

ที่เหลือก็หัดใช้ซะ แล้วก็อย่ามาถามนะว่า  ถ้าเป็น chrome ต้องทำไง ใครถามโดนด่า

วัชรเมธน์ ชิษณุคุปต์ ศรีเนธิโรทัย

Programmer, Blogger

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