Firefox Developer Edition

ウェブを開発する人のために

開発者目線で作られた唯一のブラウザー

Firefox Developer Edition — 日本語

お使いのシステムは Firefox の動作要件を満たしていませんが、以下のいずれかを試すこともできます:

Firefox Developer Edition — 日本語

お使いのシステムは Firefox を動作させるために必要な 要件 を満たしていません。

お使いのシステムは Firefox を動作させるために必要な 要件 を満たしていません。

Please follow these instructions to install Firefox.

Firefox プライバシー
Firefox Developer Edition
  • 開発者のために作りました

    開発者のために作られた唯一のブラウザーです。作成、テスト、サイズの変更といった、開発のワークフローで必要とされる機能をすべて持っています。

  • ブラウザー対応テストも簡単に

    インストールされたアドオンを利用すれば、Firefox Developer Edition を操作するだけで、他のブラウザーや、他の端末上で動作しているコードの調査やデバッグができます。

  • デザイナーにも使って欲しい

    レスポンシブデザインビューとスタイルエディターと組み合わせれば、画面サイズにあわせたレンダリング結果をその場で確認しながら CSS を編集できます。ピクセルパーフェクトな実装の大きな助けになります。

なじみのツール、だけじゃない

Firefox Developer Edition の開発ツールはおなじみのものだけではありません。強力で開発力をぐっと向上させるものが新たに搭載されています。Firefox ならではのツールを使って、より効率よく、より良い開発を。

  • スクリーンショット

    視覚編集ツール

    ページ上で再生されている CSS と HTML のアニメーションを、調査パネルから視覚的に編集できます。定規と計測ツールを使えば、あらゆる要素の整列やサイズ、パティングも確認できます。

    視覚編集ツールの詳細はこちら
  • スクリーンショット

    DevTools Challenger

    Developer Edition の視覚アニメーションツールと CSS 編集ツールを使って、深海を冒険し、奇妙な生き物たちと交流してみましょう。

    DevTools Challenger を試す
  • スクリーンショット

    パフォーマンスツール

    フレームレートや、メモリー消費量、JavaScript プロファイラーとタイムライン表示。これらのツールを使えば、パフォーマンスを下げている要因の特定と、その解消がより簡単になります。

    パフォーマンスツールの詳細はこちら
  • スクリーンショット

    ページインスペクター

    ウェブページで利用されている HTML と CSS を確認できます。これに加えて、文書の構造やレイアウトの変更も可能です。

    ページインスペクターの詳細はこちら
  • スクリーンショット

    Web Audio エディター

    Web Audio API で作成されるオーディオグラフをリアルタイムで調査でき、ノードが期待通りに接続していることの確認が容易になります。

    Web Audio エディターの詳細はこちら
  • スクリーンショット

    ウェブコンソール

    ウェブページに関するログが出力されるコンソールです。JavaScript も実行できるため、ウェブページのコンテンツを操作できます。

    ウェブコンソールの詳細はこちら
  • スクリーンショット

    JavaScript デバッガー

    ステップ実行により JavaScript のコードの振る舞いを検証したり、状態を書き換えることでバグの発見と原因の特定が容易になります。

    JavaScript デバッガーの詳細はこちら
  • スクリーンショット

    ネットワークモニター

    ブラウザーとサーバー間のすべての通信を監視できます。通信時間や、引数、ヘッダーといった各リクエストの詳細も見られます。

    ネットワークモニターの詳細はこちら
  • スクリーンショット

    スタイルエディター

    ウェブページで利用されている CSS を編集できます。また新しく CSS を作成することや、既存の CSS をページに適用することもできます。

    スタイルエディターの詳細はこちら
  • スクリーンショット

    レスポンシブデザインビュー

    画面サイズを変更しながら表示テストを行えます。もうブラウザーのウィンドウサイズを変更する必要はありません。

    レスポンシブデザインビューの詳細はこちら
  • スクリーンショット

    Valence

    ブラウザーや端末をまたがる開発や互換性のテストを効率よく行えるアドオンです。このアドオンは標準でインストールされます。

    Valence の詳細はこちら