Mozilla、Web開発者向けブラウザ「Firefox Developer Edition」をリリース。


 Mozillaが様々なWeb開発ツールを一体化した開発者向けWebブラウザ「Firefox Developer Edition」をリリースしています。詳細は以下から。


 Firefox Developer EditionのディレクターDave Camp(@campd)さんによると「魅力的なコンテンツを作成するには異なるアプリケーションストア独自の標準化や様々なプラットフォームでのブラウザチェックが必要でそのために生産性が低下しがちですが、Firefox Developer Editionはその開発ワークフローを合理化するために作られた開発者向けのブラウザです」として、以下の様な機能を例に上げています。

One of the biggest pain points for developers is having to use numerous siloed development environments in order to create engaging content or for targeting different app stores. For these reasons, developers often end up having to bounce between different platforms and browsers, which decreases productivity and causes frustration.

Firefox Developer Edition solves this problem by creating a focal point to streamline your development workflow. It’s a stable developer browser which is not only a powerful authoring tool but also robust enough for everyday browsing.
It also adds new features that simplify the process of building for the entire Web, whether targeting mobile or desktop across many different platforms.

[Mozilla Introduces the First Browser Built For Developers: Firefox Developer Edition ✩ Mozilla Hacks -the Web developer blog]


 Valenceは”Firefox Tools Adapter“として以前から知られているもので、AndroidのChromeやiOS版 Safariのシミュレータが使用可能です。

Valence also extends the awesome tools we’ve built to debug Firefox OS and Firefox for Android to the other major mobile browsers including Chrome on Android and Safari on iOS.


 WebIDEはFirefox OSアプリの開発やデバッグ用の統合環境で、クリック1つでひな形を作成しテストすることが可能です。

[開発版 Firefox で WebIDE が利用できるようになりましたb.hatena – Mozilla]

Responsive Design Mode

 Responsive Design ModeはレスポンシブデザインのWebサイトやアプリを開発する際にブラウザを変更すること無く、クリックやドラッグだけで画面サイズを変更しながら表示テストを出来る機能です。

Page Inspector

 Page InspectorはSafariやChromeに標準装備されているWebインスペクタと同様の機能で、HTMLやCSSをエレメントなどを選択しながら編集することが可能です。

Web Console

 Web ConsoleはWebページのログを見ることが可能で、JavaScriptを使用した対話も可能です。

see logged information associated with a Web page and use Web Console and interact with a Web page using JavaScript.

JavaScript Debugger

 JavaScript DebuggerはJavaScriptの実行や検証ができ、Consoleと併用してバグの発見などにも使用できるそうです。

Network Monitor

 Network MonitorはHTTP Requestなどのサーバー間との通信をモニタリングでき、通信時間やヘッダなど詳細やパフォーマンスグラフの表示も可能です。

Style Editor

 Style EditorはCSSの閲覧、変更ができリアルタムで変更が表示されます。

Web Audio Editor

 Web Audio EditorはWeb Audio APIのインスペクター&エディタでWeb Audio APIのコンテンツをリアルタイムモニタで聞きながら編集することが可能です。

 Firefox Developer Editionはユーザ登録などの必要なく誰でも使用可能なので興味のある方は関連リンクからどうぞ。

Firefox Developer Edition b.hatena – Mozilla

Firefox OSアプリ開発ガイド
本間 雅史