Yerelde Hata Ayıklama (Volan ile): Başlangıç ​​Kılavuzu

Bir web sitesinde veya hatta bir web sitesinin yerel kurulumunda sorun çıkması sinir bozucu olabilir. Sonuçta, site performans sorunları veya hataları sitenin kapalı kalmasına neden olabilir. Sitenin kapalı kalma süresi, trafik kaybı, kaçırılmış fırsatlar ve hatta gelir kaybı anlamına gelebilir.

Neyse ki, site sorunlarını belirlemek ve onarmak için çok sayıda hata ayıklama çözümü mevcuttur. Ancak durumunuz için en iyi neyin işe yarayacağını nasıl bilebilirsiniz?

Yerel'de hata ayıklama için çok yönlü bir yaklaşım vardır. Burada, Yerel'de bulunan varsayılan hata ayıklama seçeneklerinin yanı sıra hataları belirlemenin yollarını ve sorunları daha hızlı ve verimli bir şekilde tespit etmek ve düzeltmek için kullanabileceğiniz ek eklentileri tartışacağız.

Yerelde Xdebug nedir?

Local'de nasıl hata ayıklanacağını tartışmadan önce, Local'de bulunan hata ayıklama aracı olan Xdebug ve en dikkate değer özelliklerinden bazıları hakkında konuşmamız gerekiyor.

Xdebug aslında hata ayıklama sürecini basitleştiren bir PHP uzantısıdır. Öncelikle, var_dump () işlevinin biçimlendirmesini daha temiz hale getirir ve belirli hatalar hakkında daha fazla uyarı ve bildirim ekler. Bu şekilde, daha sezgisel bir kullanıcı deneyimi sağlar.

Bilmiyorsanız, var_dump() , kodunuzda neyin yanlış olduğunu çabucak ortaya çıkaran kullanışlı bir PHP parçasıdır. Ancak buradaki fark, eğer Xdebug elinizde yoksa, var_dump() çağırdığınızda üretilen koddur. okumak çok daha zor olurdu. Ayrıca, var_dump() çağırırken bile PHP'nizi çok özel bir şekilde biçimlendirmeniz gerekir. ilk başta.

Xdebug, Hatalar ortaya çıktıklarında daha fazla bilgi derinliği sunduğu için Yerel'de mevcuttur. Ayrıca, özellikle daha büyük sorunlar için hata ayıklama sürecini kolaylaştıran bir adım hata ayıklayıcı ile birlikte gelir. Adım hata ayıklayıcı, kodunuzu belirli kesme noktalarında adım adım değerlendirmenize izin vererek çalışır. Bu, kodu daha küçük bölümlerde değerlendirmenize ve sorunları daha kolay bulmanızı sağlar.

Ve en iyi yanı, Xdebug'un varsayılan olarak Yerel'de etkin olmasıdır, bu nedenle başlamak için herhangi bir ayarla uğraşmanıza bile gerek yoktur. Sadece Yerel'i açın ve gidin.

Yerel Olarak Bir Web Sitesinde Nasıl Hata Ayıklanır

Yerel bir web sitesinde birkaç temel yolla hata ayıklayabilirsiniz. Burada tartışacağımız birincil adımlar şunlardır:

1. Tarayıcı konsolu hatalarını belirleme
2. Sorgu İzleyicisini Kullanma
3. Xdebug ve VS Kodu ile
4. Xdebug ve PhpStorm ile
5. Adım hata ayıklama için Xdebug kullanma

Hadi dalalım.

1. Tarayıcı Konsolu Hatalarını Tanımlayın

Hata ayıklamanın ilk adımı, tüm tarayıcı geliştirici araçlarının bir parçası olan tarayıcı konsolunu kullanmaktır. Bu, herhangi bir özel araç kullanmadan web sayfalarındaki hataları tespit etmenizi sağlar. Basitçe Yerel'i başlatın, seçtiğiniz tarayıcıyla söz konusu sayfaya erişin ve hataları tespit etmek için konsolu kullanın. Aşağıda, tarayıcı konsoluna birden çok tarayıcıda nasıl erişileceğinin bir dökümü yer almaktadır.

Chrome Kullanıyorsanız…

1. Chrome tarayıcı menüsündeyken Diğer Araçlar > Geliştirici Araçları'na giderek DevTools'u açın. Alternatif olarak, Ctrl/Cmd+Shift+I tuşlarına basın .
2. Konsol sekmesine tıklayın.
3. Mevcut herhangi bir hata varsa, şimdi görünür olmalıdır. Değilse, bunları oluşturmak için web sayfasını yeniden yükleyin.
4. Hatanın türünü, bulunduğu yeri ve tarayıcı konsolundaki satır numarasını not edin.

Firefox Kullanıyorsanız…

1. Firefox menüsündeyken Diğer Araçlar > Web Geliştirici Araçları'na giderek tarayıcı geliştirici araçlarını açın. Ctrl/Cmd+Shift+I burada da çalışır.
2. Konsolu tıklayın sekme. Alternatif olarak, konsola doğrudan Diğer Araçlar > Tarayıcı Konsolu üzerinden de erişebilirsiniz.
3. Herhangi bir hata şimdi görünür olmalıdır. Değilse, sayfayı yeniden yükleyin.

Safari Kullanıyorsanız…

1. Safari menüsündeyken Tercihler > Gelişmiş'e giderek Geliştirici Araçlarını açın. Option+Cmd+I buradaki arkadaşınız.
2. Menü çubuğunda Geliştirme menüsünü göster'in yanındaki kutuyu işaretleyin. Ardından, iletişim kutusunu kapatın.
3. Geliştir > Hata Konsolunu Göster'i tıklayın. Yukarıdakiyle aynı anlaşma.

Bu bilgilerle donanmış olarak, Yerel'de kurulan dosya sistemine geri dönebilir ve sorunlara neden olan belirli kod parçasını bulabilir ve ardından bir düzeltme uygulayabilirsiniz. Yerel web sitelerinizin konumuna erişmek için Site klasörüne git düğmesini kullanın.

2. Site Performansı Sorunlarını Düzeltmek için Sorgu İzleyicisi'ni kullanın

Web sitesi sorunlarını doğrudan WordPress'te de tanımlayabilir ve onarabilirsiniz. Aslında, Query Monitor eklentisi hata ayıklamak ve özellikle performans sorunlarını belirlemek için harika bir seçimdir. Bu, yerleşik Yerel hata ayıklama araçlarıyla yardımcı bir ikili oluşturur ve özellikle üçüncü taraf eklenti ve tema sorunlarını tespit etmek için yararlıdır.

Eklentiyi diğerleri gibi yükleyebilirsiniz. Eklentiler > Yeni Ekle'ye gidin ve ada göre arayın. Listede bulun ve Şimdi Yükle'yi ve ardından indirildikten sonra Etkinleştir'i tıklayın.

Sorgu İzleyicisi Size Ne Söyleyebilir?

Eklentiyi yükledikten sonra, WordPress panosunun üst kısmında yeni bir menü seçeneği görmelisiniz.

Fareyle üzerine gelindiğinde, Sorgu İzleme araçları ve seçeneklerinin bir açılır listesi görüntülenir. Bunlardan herhangi birini seçmek, mevcut sayfa hakkında daha fazla ayrıntı öğrenebileceğiniz altta bir menü açacaktır.

Diğer şeylerin yanı sıra, Sorgu İzleyicisi size aşağıdakiler dahil olmak üzere sayfanızın performansına ilişkin bir genel bakış sunar:

• En Yüksek Bellek Kullanımı. Bu araç, belirli bir zamanda bir sayfa oluşturmak için ne kadar bellek kullanıldığını gösterir.
• Sayfa Oluşturma Süresi. Bir sayfanın oluşturulması için geçen süreyi gösterir.
• Veritabanı Sorgu Zamanı. Son olarak, bu araç, veritabanının tema veya eklenti isteklerine yanıt vermesinin ne kadar sürdüğünü gösterir.

Performans sorunlarının ötesinde, bu eklenti PHP hatalarını ve bildirimlerini de belirleyebilir – tıpkı Xdebug'un yaptığı gibi. Ancak çabaları üçüncü taraf temalara ve eklentilere odaklanıyor. Burada kullanışlı olan şey, eğer hatalar varsa, araç içinde uygun bir şekilde PHP Hataları olarak adlandırılan ve her hatayı güvenlik tehdidiyle birlikte listeleyen yeni bir sekmenin görünmesidir. Ayrıca size hatanın göründüğü kod satırını ve belirli hata kodunu veya bildirimini de söyleyecektir.

Şimdi bu, halihazırda yayında olan veya geç aşamada test edilen web siteleri için gerçekten yararlıdır. Ancak, hala yerel geliştirme aşamasındaysanız, Xdebug'u Yerel'de kullanmak en iyi seçeneğiniz olacaktır.

3. Hata Ayıklama için Xdebug ve VS Kodunu Ayarlama

Yerel'e döndüğünüzde, yerel site hata ayıklamasını gerçekleştirmek için Xdebug'u çeşitli şekillerde kullanabilirsiniz. Paranızın karşılığını daha fazla almak için, tabiri caizse, denkleme VS Kodunun gücünü ekleyebilirsiniz.

VS Code, genişletilmiş araçlara ve daha sezgisel bir kullanıcı arayüzüne sahip bir açık kaynak kod düzenleyicisidir. Bu satır satır hata ayıklama sürecini çok daha sezgisel ve göze daha kolay hale getirir.

Gerçekten harika bir etki için VS Kodunu Xdebug Adım Hata Ayıklayıcısına bağlayabilirsiniz. Yerel içinde kullanım için nasıl ayarlayacağınız aşağıda açıklanmıştır:

1. VS Code'u indirin ve geliştiricinin talimatlarına göre yükleyin.
2. Bir PHP hata ayıklayıcı uzantısı indirin ve kurun. Local'in belgeleri, bu görev için PHP Debug uzantısını önerir.
3. Yerel'de Eklentiler > Xdebug + VS Kodu'nu tıklayın.
4. Eklenti Yükle 'yi tıklayın.
5. Bittiğinde, Etkinleştir ve Yeniden Başlat'a basın .
6. Yerel'de bir site açın ve ardından Yardımcı Programlar sekmesine tıklayın.
7. Çalıştırma Yapılandırmasını VS Koduna Ekle öğesine tıklayın.
8. VS Kodu başlatılacak ve ardından hata ayıklama işlemini başlatabilirsiniz.

VS Code'u tercih etmiyorsanız, görev için başka bir düzenleme aracı kullanabilirsiniz.

4. Hata Ayıklama için Xdebug ve PhpStorm Kurulumu

Başka bir seçenek de PhpStorm'u Xdebug ile kullanmaktır. Eklenti aracılığıyla Yerel'e ekleyebilirsiniz ve Xdebug Adım Hata Ayıklayıcı ile birlikte çalışır. Kurulum ve kurulum, yukarıda VS Kodu için açıklanan işleme çok benzer. Kullanmak için aşağıdaki adımları uygulayın:

1. PhpStorm'u indirin ve yükleyin.
2. Yerel'de Eklentiler > Xdebug + PhpStorm öğesini tıklayın.
3. Eklenti Yükle 'yi tıklayın.
4. İşlem tamamlandıktan sonra tekrar Etkinleştir ve Yeniden Başlat .
5. Herhangi bir siteyi Yerel'de açın ve Yardımcı Programlar'ı tıklayın. sekme.
6. Çalıştırma Yapılandırmasını PhpStorm'a Ekle'ye tıklayın.
7. PhpStorm etkinken, kesme noktasının gerçekleşmesini istediğiniz belirli kod satırındaki oluğa tıklayarak kesme noktaları ayarlayın.
8. Hata ayıklama işlemini başlatmak için Oynat'a tıklayın.

Hata ayıklama sürecinde daha fazla rehberlik istiyorsanız, Adım Hata Ayıklama her zaman bir seçenektir.

5. Adım Hata Ayıklama için Xdebug Kullanımı

Adım Hata Ayıklama, süper kullanışlı bir araçtır ve Xdebug'un, hata ayıklama işlemi boyunca esasen elinizi tutan bir parçasıdır. Ayrıntılı ancak takip edilmesi kolay hata ayıklama araçları, adımları ve protokolleri sağlamak için VS Code ve PhpStorm (ve diğer birçok IDE ve metin düzenleyicisi) ile birlikte çalışır.

Yerel'de, Xdebug'u kurmak için herhangi bir şey yapmanız gerekmez – varsayılan olarak otomatik olarak etkinleştirilir. Karmaşık bir test ortamınız varsa (birden çok sistemin aynı anda katkıda bulunduğu) daha karmaşık kurulum talimatları olsa da, şimdilik hata ayıklamayı tek bir sistemde, tek bir Local kurulumunda gerçekleştirmeniz gerektiğini varsayacağız.

Adım hata ayıklamayı kullanmak için tek yapmanız gereken önceki iki bölümde özetlenen adımları izlemektir. Bu özellik hem VS Kodu hem de PhpStorm ile çalışır. Her şey ayarlandıktan sonra, otomatik olarak kesme noktaları ayarlayacak ve kodu birer birer oynatacaktır. Bu, kodunuzu çalıştırmanın, hataları görmenin ve ortaya çıktıkça düzeltmenin sezgisel bir yolunu sunar.

Yerelde Hata Ayıklama Kolaylaştı

Gördüğünüz gibi, Yerel'de hata ayıklama, başlamak için minimum kurulum gerektiren oldukça kolay bir işlemdir. Birincil hata ayıklama aracı varsayılan olarak zaten mevcuttur. Tek yapmanız gereken tercih ettiğiniz metin düzenleyiciyi veya IDE'yi kurmak, bir veya iki eklentiyi yapılandırmak ve her şey hazır. Elbette, web sitenizi en iyi duruma getirmek için gerçek hata düzeltmelerini yapmanız gerekecek. Ama en azından, hata ayıklama sürecinin kendisi kolaylıkla ve en az sorunla yürütülebilir.

Yerelde hata ayıklamak için tercih ettiğiniz araçlar nelerdir? Aşağıdaki yorumlarda görüşlerinizi duymak isteriz.