Firefox Geliştirici Araçları

HTML, CSS ve JavaScript'i telefonundan ve masaüstü bilgisayarından incele, düzenle ve ayıkla. Geliştirici araçları son sürümleri için Firefox Gelistirici Sürümü'nü indir.

Aurora' da neler yeni?

Son Firefox Aurora dağıtımı Firefox 27' dir, ve geliştirici araçları için bu güncellemeleri içerir:

Shader Editor, WebGL shader'larını görmenizi ve değiştirmenizi sağlar
Debugger'ı dinlediğiniz DOM olaylarında durması için talimat verin
Denetçide HTML'yi değiştirin
Denetçinin Kurallar Sekmasinde, renk paletlerini ve arkaplanları görün
The Web Console now logs reflow events
Kod Görüntüleyici şimdi çoğu araçta kaynak editörü olarak kullanılmakta

Firefox Geliştirici Araçları'nı HTML and CSS'i incelemek ve düzenlemek, JavaScript'te hata ayıklamak ve sayfa içinde JavaScript'i çalıştırmak için kullanabilirsiniz. Bir sayfayı yüklerken tarayıcınızın karşılaştığı JavaScript ve CSS uyarı ve hatalarını görebilmeye ek olarak, ağ isteklerini görmek için de bu geliştirici araçlarını kullanabilirsiniz.

You can use the developer tools to debug code running Firefox for Android, and soon, Firefox OS. We've also provided tools that target mobile development: the Responsive Design View is a quick way to see how a site will look on a small screen, and the Firefox OS Simulator lets you run and debug a Firefox OS app on the desktop without needing to use a real Firefox OS device.

Firefox add-ons can access the debugger API, so you can build your own developer tools that extend and enhance the built-in tools. With the remote debugging protocol you can implement your own debugging clients and servers, enabling you to debug websites using your own tools or to debug different targets using the Firefox tools.

Araç Kutusu

Araç Kutusu, Firefox içindeki tüm Geliştirici Araçları'nı tek çatı altına toplamayı sağlamaktadır.

Sayfa Denetçisi: Görünüm ve seçili öğe için HTML ve CSS ayarları.
Web Konsolu: Web sayfası yükleyen browser tarafından gönderilen bilgi, uyarı ve hata mesajlarını görün, ve JavaScript kullanarak sayfayı inceleyin ve degiştirin.
Biçim Editörü: Sayfanızdaki CSS ayarlarını görün ve düzenleyin.
JavaScript Debugger: Browserda calışan JavaScript kodunu inceleyin ve değişkenleri takip ederek kodunuzu debug edin.
JavaScript Profiler: Profiler'ı kullanarak JavaScript'inizin vaktini nerede harcadığını anlayın.
Ağ izleyici: Bir sayfa yüklendiğinde gerçekleşen bütün ağ taleplerini ve ne kadar süre aldıklarını inceleyin.
Shader Editor: View and edit the vertex and fragment shaders used by WebGL.

Mobil

Elbette mobil web geliştiricileri de web geliştiricileridir. Bu nedenle wen geliştirme araçlarının çoğunun mobil wen geliştiricilerini de ilgilendiriyor.Fakat sadece mobil geliştirmeyi hedefleyen bazı araçlar da hazırladık.

Uzaktan Hata Ayıklama: Android cihazında USB üzerinden hata ayıklamak için geliştirici araçlarını kullanın.
Firefox OS Simülatör: Gerçek bir Firefox OS cihazı kullanmanıza gerek kalmadan masaüstünde Firefox OS uygulamanızı çalıştırın ve hata ayıklayın.
Responsive Tasarım Görünümü: Tarayıcı pencerenizin boyutunu değiştirmeden web sitenizin veya uygulamanızın farklı ekran boyutlarında nasıl görüneceğini görün..

Bağımsız Araçlar

Bu araçlar Firefox'a dahil edilebilir, ama kullanıcı arayüzleri (GUI) Araç Kutusu'na entegre edilemezler.

Scratchpad: A text editor built into Firefox that lets you write and execute JavaScript.
Browser Console: See messages from all JavaScript code running in the browser including content, chrome, and add-ons. Execute JavaScript code in the chrome window's context.
Developer Toolbar: A command-line interface to manipulate and work with the developer tools in Firefox, and buttons for quick access to the most commonly used tools.
3D View: Also known as "Tilt", this provides a 3D visualisation of the current page.
Paint Flashing Tool: The paint flashing tool highlights the part of the browser window that are repainted in response to events, helping to diagnose potential performance problems with your site.

Diğer Kaynaklar

This section lists resources which aren't maintained by Mozilla's developer tools team, but which are widely used by web developers. We've included a few Firefox add-ons in this list, but for the complete list see the "Web Development" category on addons.mozilla.org.

Firebug: A very popular and powerful web development tool, including a JavaScript debugger, HTML and CSS viewer and editor, and network monitor.
DOM Ayıklayıcı: Inspect, browse, and edit the DOM of web pages or XUL windows.
Web Geliştirici: Adds a menu and a toolbar to the browser with various web developer tools.
Web Tasarım Aracı: A set of tools developed by Mozilla, aimed at people getting started with Web development.
W3C Doğrulayıcı: The W3C website hosts a number of tools to check the validity of your website, including its HTML and CSS.
JSHint: JavaScript kod analiz aracı

Join the Developer tools community

Choose your preferred method for joining the discussion:

IRC: #devtools (learn more)
Team info: Dev tools wiki
Blog: Hacks blog