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機能
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
WebIDEはFirefox OSアプリの開発やデバッグ用の統合環境で、クリック1つでひな形を作成しテストすることが可能です。
[開発版 Firefox で WebIDE が利用できるようになりました – 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 – Mozilla
コメント