• Giới Thiệu
  • Chính Sách & Bảo Mật
  • Liên Hệ & Quảng Cáo
Tech News, Magazine & Review WordPress Theme 2017
  • PHẦN MỀM
  • GAME – TRÒ CHƠI
  • THỦ THUẬT
  • MẠNG XÃ HỘI
  • HỆ ĐIỀU HÀNH
  • MICROSOFT OFFICE
  • ADOBE
No Result
View All Result
  • PHẦN MỀM
  • GAME – TRÒ CHƠI
  • THỦ THUẬT
  • MẠNG XÃ HỘI
  • HỆ ĐIỀU HÀNH
  • MICROSOFT OFFICE
  • ADOBE
No Result
View All Result
Hoamitech.com
No Result
View All Result

Hướng dẫn sử dụng Debug code PHP với Xdebug Sublime Text 3

Hoai My by Hoai My
15/07/2021
Home THỦ THUẬT
Share on FacebookShare on Twitter

Xdebug Sublime Text 3 là một text editor rất phổ biến. Tuy nhiên việc viết code một cách trơn tru ngay từ lần đầu tiên đã rất khó khăn, thậm chí là bất khả thi. Do đó debug là một kỹ năng vô cùng quan trọng đối với mỗi lập trình viên. Vậy làm sao để có thể debug với Xdebug kết hợp với Sublime Text 3?

Trong bài viết dưới đây, Hoamitech.com sẽ chia sẻ đến các bạn cách Xdebug Sublime Text 3. Cùng theo dõi để cập nhật ngay những thông tin hữu ích này nhé! Đây sẽ là kiến thức khá quan trọng đối với các lập trình viên đấy!

Nội Dung Chính

  • Cài đặt package Xdebug Sublime Text 3
  • Debug với Xdebug Sublime Text 3
    • Khởi động phiên làm việc của Xdebug Sublime Text 3
    • Breakpoints
    • Tiến hành debug
  • Kết luận

Cài đặt package Xdebug Sublime Text 3

Một trong những thế mạnh của Sublime Text là bạn có thể mở rộng nó một cách dễ dàng với các package. Trong trường hợp này, chúng ta sẽ cài đặt package Xdebug Client.

Đầu tiên, hãy chắc chắn rằng bạn đã cài đặt package control. Sau khi cài đặt package control xong, bật Sublime Text. Ở đây mình sẽ thực hiện với Sublime Text 3, nhưng tất nhiên là Xdebug cũng hoạt động với cả Sublime Text 2. Mở cửa sổ câu lệnh tìm kiếm (Ctrl + Shift + P) và tìm “install package”.

Tìm kiếm "install package"
Tìm kiếm “install package”

Tiếp đó chúng ta sẽ tìm package “Xdebug client”

Tìm package "Xdebug client"
Tìm package “Xdebug client”

Bước cuối cùng chúng ta phải làm là cấu hình project trong Sublime. Cách đơn giản nhất để làm điều này là mở thư mục gốc của project, chọn menu Project và chọn “Save projects as”. Nên lưu file này trong thư mục gốc của project, để có thể lưu nó trong hệ thống version control của bạn và bạn có thể cấu hình nó một cách dễ dàng.
Mở file vừa tạo ra, nội dung sẽ giống như thế này:

Nội dung trong File
Nội dung trong File

Chúng ta sẽ bổ sung thêm một vài dòng:

Nội dung bổ sung thêm
Nội dung bổ sung thêm

Như bạn thấy, chúng ta chỉ cần thêm vào URL của ứng dụng web.

Chú ý: Nếu như project của bạn chạy trên local thì cần phải tạo virtual host.

Chúng ta có thể thiết lập nhiều cài đặt hơn cho Xdebug, nhưng thế này là đủ để bắt đầu. Cũng có thể thiết lập URL này trong chính cài đặt của Xdebug, nhưng trong trường hợp đó, chúng ta sẽ không thể làm việc trên nhiều project mà không cần phải thay đổi cấu hình Xdebug mỗi lần.

Debug với Xdebug Sublime Text 3

Bây giờ chúng ta có thể bắt đầu phiên làm việc của Xdebug và xem liệu mọi thứ đã được cài đặt đúng chưa.

Khởi động phiên làm việc của Xdebug Sublime Text 3

Trong menu, chọn Tools -> Xdebug và chọn Start debugging (launch browser). Bạn sẽ thấy trang web của bạn được mở ra và tham số ?XDEBUG_SESSION_START=sublime.xdebug được thêm vào cuối URL. Khi đó phiên làm việc của Xdebug sẽ bắt đầu. Trong Sublime, một số bảng phụ xuất hiện là nơi hiển thị thông tin debug, sau khi bạn đã đặt các breakpoints.

Khởi động phiên làm việc cuả Xdebug
Khởi động phiên làm việc cuả Xdebug

Breakpoints

Hãy đặt một breakpoint đầu tiên. Một breakpoint về cơ bản là một cái cờ nơi mà ứng dụng của bạn sẽ tạm dừng khi chạy đến đó. Tại thời điểm nó tạm dừng, bạn có thể kiểm tra giá trị tất cả các biến để bạn biết thực tế những gì đang xảy ra.
Chúng ta có thể thêm một breakpoint bằng cách click chuột phải trên một dòng, chọn Xdebug và chọn add/remove breakpoint. Một điểm đánh dấu sẽ được thêm vào lề của dòng đó để chỉ ra rằng một breakpoint đã được đặt.

Breakpoints
Breakpoints

Trên trình duyệt vừa được mở ra, ngay khi bạn đến trang nơi breakpoint được đặt, bạn sẽ thấy trang web sẽ ngừng tải. Mở Sublime và rất nhiều thông tin sẽ hiện ra trong các bảng của Xdebug.

Các Xdebug stack và Xdebug context rất thú vị.

  • Trong stack, bạn có thể nhìn thấy toàn bộ stacktrace mà bạn đã đi qua.
  • Trong context, bạn sẽ thấy tất cả các biến toàn cục, và cả các biến bạn tự định nghĩa. Bạn có thể click vào các biến để xem chính xác bên trong các biến. Ví dụ, trong hình dưới đây, tôi chọn biến $ _SERVER.
Xdebug stack và Xdebug context
Xdebug stack và Xdebug context

Chú ý rằng có một mũi tên màu vàng chỉ vào dòng mà tại đây ứng dụng đang dừng lại.

Tiến hành debug

Ứng dụng của chúng ta đã dừng lại và bây giờ chúng ta có thể xem qua các biến được định nghĩa. Tuy nhiên, chúng ta đã xem xong và muốn đi tiếp thì làm gì bây giờ? Khi bạn nhấp chuột phải một lần nữa chọn menu Xdebug, bạn sẽ có các lựa chọn:

  • Run: Chạy ứng dụng cho đến khi tới điểm dừng tiếp theo hoặc cho đến khi kết thúc.
  • Run to line: Chạy đến dòng bạn click vào.
  • Step into: Nhảy vào hàm hiện tại và dừng lại ngay sau đó.
  • Step over: Nhảy qua hàm hiện tại và dừng lại ngay sau đó.
  • Step out: Nhảy ra khỏi hàm hiện tại và dừng lại ngay sau đó.
  • Stop: Dừng việc sửa lỗi.
  • Detach: Cũng sẽ dừng việc sửa lỗi.

Chạy và dừng thì khá dễ hiểu, tuy nhiên các hàm nhảy có thể gây nhầm lẫn. Hãy xem một ví dụ đơn giản:

Ví dụ minh họa
Ví dụ minh họa

Hãy tưởng tượng bạn thêm một breakpoint vào dòng đầu tiên của hàm bar, trên dòng có comment // Breakpoint

  • Với Step into, trình gỡ lỗi sẽ nhảy vào hàm fooBar và sẽ dừng lại ở dòng đầu tiên trong đó, tức là sẽ dừng ở dòng return array_values($arr);
  • Với Step over , nó sẽ gọi hàm, nhưng sẽ không dừng lại. Nó sẽ dừng lại ở dòng tiếp theo sau khi gọi hàm.
  • Vì vậy, trong trường hợp này, nó sẽ dừng lại ở return $arr;
  • Cuối cùng, với Step out nó sẽ chạy qua toàn bộ hàm bar và trả về nơi đã gọi nó. Trong trường hợp này, nó sẽ nhảy ra ngoài của đối tượng, trở về đối tượng gọi gốc.
  • Nếu bạn cứ run, ứng dụng sẽ chạy thêm cho đến thời điểm nó được thực thi xong hoặc breakpoint khác xảy ra.

Đọc thêm: Hướng dẫn sử dụng plugin Emmet Sublime Text 3

Kết luận

Vậy là trong bài viết này Hoamitech.com đã hướng dẫn các bạn cách tích hợp Xdebug Sublime Text 3. Đồng thời phần nào hiểu được cách thức debug. Hy vọng qua bài viết này, các bạn sẽ không còn vất vả khổ sở trong quá trình viết code như trước nữa!

Nếu còn vấn đề gì thắc mắc, hãy để lại comment phía dưới bài viết. Và đừng quên comment thêm những vấn đề mà bạn còn muốn tìm hiểu để tụi mình làm ra thêm ngày càng nhiều thông tin hữu ích đến bạn đọc nhé! Cảm ơn các bạn đã theo dõi hết bài viết của mình. Hẹn gặp lại các bạn ở những topic sau nhé!

Hoai My

Hoai My

Next Post
CCleaner Update- Hướng cập nhật CCleaner mới nhất

Hướng dẫn Update CCleaner bản mới nhất [hienthithang]/[hienthinam]

Trả lời Hủy

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

CÓ THỂ BẠN QUAN TÂM.

Sound booster là gì? Tải Sound Booster kèm Key vĩnh viễn 2021

Download Letasoft Sound Booster 1.11 Miễn Phí Full – Share Key mới cập nhật 06/2022

19/02/2022
Hướng dẫn đăng ký và sử dụng Outlook Office 365 Mail

Hướng dẫn tạo tài khoản và sử dụng Outlook Office 365 Mail đơn giản 06/2022

04/05/2022

ĐƯỢC XEM NHIỀU.

Chia sẻ link nhóm kín Telegram giúp chống tối cổ mới nhất [hienthinam]

Share Telegram Group Link – Nhóm Kín Hóng Link Telegram Mới 06/2022

26/04/2022
Cách làm mục lục tự động trong Word đơn giản, nhanh chóng [hienthinam]

Hướng dẫn cách tạo mục lục tự động trong Word 2007, 2010, 2013, 2016 chi tiết mới 2022/2022

24/06/2022
Cách đọc trộm tin nhắn Facebook của người khác đơn giản

Cách xem trộm tin nhắn Facebook, Zalo bằng điện thoại,máy tính không cần mật khẩu 06/2022

30/05/2022
Hướng dẫn cách hiển thị thanh công cụ trong cad khi bị mất

Hiển thị thanh công cụ (Ribbon) trong CAD khi bị ẩn nhanh chóng, hiệu quả mới 06/2022

18/04/2022
Hướng dẫn cách xem tin nhắn đã gỡ trên messenger trên điện thoại và PC

Cách xem tin nhắn đã gỡ, thu hồi trên Messenger trên máy tính, điện thoại cực nhanh 06/2022

26/03/2022
Hoamitech.com

Hoamitech.com là website chia sẻ kiến thức, thủ thuật, phần mềm & công nghệ miễn phí. Chúng tôi còn hướng dẫn tải, download và cài đặt game, trò chơi, phần mềm cho máy tính PC, laptop, mobile đơn giản, dễ nhiểu nhất

Theo Dõi Hoamitech.com

Chuyên Mục Hay

  • ADOBE
    • Adobe XD
    • After Effects
    • Illustrator
    • InDesign
    • Lightroom
    • Photoshop
    • Premiere Pro
    • Premiere Rush
  • ANDROID
  • GAME – TRÒ CHƠI
  • IOS
  • LINUX
  • MAC OS
  • MẠNG XÃ HỘI
    • Facebook
    • Instagram
    • TikTok
    • Twitter
  • MICROSOFT OFFICE
    • Excel
    • PowerPoint
    • Word
  • PHẦN MỀM
    • Bảo Mật & Diệt Virus
    • Chat, Nhắn Tin – Gọi Video
    • Chỉnh Sửa Ảnh & Video
    • Đồ Họa
    • Giáo Dục & Học Tập
    • Hệ Thống
    • Internet
    • Lập Trình
    • Nghe Nhạc & Xem Phim
  • PHẦN MỀM DOANH NGHIỆP
  • THỦ THUẬT
  • Tin Tức Mới
  • WINDOWS

Bài Viết Mới

Tải Adobe Photoshop CC 2017 Portable Miễn Phí

Download Adobe Photoshop CC 2017 Portable Full Miễn Phí Không Cần Cài Đặt [Update 06/2022]

27/05/2022
Cách update Win 8 lên Win 10 bản quyền thành công 100% mới [hienthinam]

Hướng dẫn cách cập nhật Windows 8 lên Windows 10 chi tiết, thành công 100% mới 06/2022

24/05/2022
  • Giới Thiệu
  • Chính Sách & Bảo Mật
  • Liên Hệ & Quảng Cáo

© 2021 Copyright by Hoamitech.com

No Result
View All Result
  • Phần Mềm
  • Game – Trò Chơi
  • Thủ thuật
  • Hệ Điều Hành
  • MICROSOFT OFFICE
  • MẠNG XÃ HỘI
  • ADOBE

© 2021 Copyright by Hoamitech.com