タグ

firebugに関するtyamamotoのブックマーク (7)

  • Firebug の使い方:(X)HTML と CSS の確認・修正方法のまとめ

    Firefox アドオンの「Firefbug」はご存知の方も多いと思いますが、Firefbug を使って表示しているページの(X)HTMLマークアップや CSS を確認・修正する方法のまとめを紹介します。 特に3項に記した、(X)HTMLCSSを一発で確認する方法はおすすめです。 動作は Firefox 3.5 + Firebug 1.4.0b7 で確認しています。 1.基:(X)HTML マークアップと CSS を表示する 確認したいページを表示した状態で、メニューバーの「表示」→「Firebug」を選択します。または F12 を押下します。 これでページ下半分に Firebug のウィンドウが表示され、左側に(X)HTMLマークアップ、右側にそのページで使われている左側のウィンドウで選択状態になっている要素の CSS が表示されます。この手順で Firebug の画面を開くと、bo

    Firebug の使い方:(X)HTML と CSS の確認・修正方法のまとめ
  • jQueryを使った開発に便利!Firebug + jQuery·FireQuery MOONGIFT

    Firefoxを使ってWebシステムを開発する際には必須とも言えるFirebug。そして人気の高いJavaScriptライブラリのjQuery。この二つが組み合わさったとき、これまで以上の魅力が感じられるようになる。 マウスを当てるとそのエレメントがハイライト表示される そう確信できるのがFireQueryを使った瞬間だ。この二つの融合は、JavaScriptの開発をバーストしてくれるのではないだろうか。 今回紹介するオープンソース・ソフトウェアはFireQuery、Firebugと連携するjQuery開発補助アドオンだ。 FireQueryはconsole.logに吐き出した内容を元に、画面上のエレメントをハイライトしてくれる。例えばconsole.log($('p'));と出せば、コンソールに出力された jQuery(p)という表示にマウスを当てると、該当部分がハイライト表示になる。ど

    jQueryを使った開発に便利!Firebug + jQuery·FireQuery MOONGIFT
  • FirePHPがますます便利になっている件:phpspot開発日誌

    FirePHP - Firebug Extension for AJAX Development FirePHPがますます便利になっている件、ということで、以前に紹介したFirePHPですが、色々と更新されているようなのでご紹介。 アイコンも変わってます まず、どういうことが出来るか、という点です。以前紹介した時とやり方が結構改善されているみたい。 <?php FB::log('Log message'); FB::info('Info message'); FB::warn('Warn message'); FB::error('Error message'); ?> と書くと、以下のように表示されます。 firebugのconsole.logみたいに使えます。 PHPのコード内で、1行でかけるのでなかなか便利そうです。 次のように、オブジェクト指向で書くこともできるみたい <?php

  • MOONGIFT: Firebugと連携するPHPライブラリ「FirePHP」:オープンソースを毎日紹介

    JavaScriptを多用する時代にあって、Firebugのありがたさを感じている人は多いのではないだろうか。開発の補助ツールとして、何らかの問題が起こった時のデバッグツールとして活躍していることだろう。 ログをFirebug上で確認できるようになる そんなFirebugがPHP開発において活用できるFirefoxアドオンがこれだ。 今回紹介するオープンソース・ソフトウェアはFirePHPPHPと連携するFirebugだ。 FirePHPはFirebugをインストール済みの状態で使うプラグイン的なアドオン(分かりづらい)だ。PHP側でもPearを通じてライブラリをインストールする必要がある。それが終わったら、FirePHPのインスタンスを呼び出せるようになる。 サンプルのコード そしてログを出力することや、ダンプしたデータを出力できるようになる。また、コンソールにエラーメッセージを出力す

    MOONGIFT: Firebugと連携するPHPライブラリ「FirePHP」:オープンソースを毎日紹介
  • ウェブ制作にかかせないFirebugの機能を更に強化する機能拡張集 | コリス

    Sofrware is hardのエントリーから、豊富な開発ツールを備えたFirefoxのアドオン「Firebug」の機能を強化する機能拡張を紹介します。 List of Firebug Extensions Firebug HTML, CSS, JavaScriptなどを編集・デバッグ・モニタリングできる開発ツール。 以下の全ての機能拡張は、Firebug上で動作します。 Firebug Firebug -Firefox Add-ons YSlow ページの分析、パフォーマンスレポート、HTTP/HTMLサマリー、コンポーネントのリスト YSlow YSlow -Firefox Add-ons Firecookie クッキーの管理 Firecookie Firecookie -Firefox Add-ons FirePHP PHPのデバッグ FirePHP FirePHP -Firefo

    ウェブ制作にかかせないFirebugの機能を更に強化する機能拡張集 | コリス
  • 特集:Firefox 3とFirebugで始めるJavaScript開発|gihyo.jp … 技術評論社

    第3回Command Line APIとその活用、各タブからのデバッグ方法 堀邦明 2008-05-21

    特集:Firefox 3とFirebugで始めるJavaScript開発|gihyo.jp … 技術評論社
  • FirebugでPHPをデバッグするツールまとめ

    こんにちは、亀です。最近は体調がすこぶる絶不調です。季節の変わり目なので、皆さんも気をつけてください。 さて、ちょろちょろと話題に上ることの多いFirefoxを使ったPHPのデバッグ手法ですが、いくつか出てきたのでこの辺でサクッとまとめておこうかと思いました。 結果的に、だいぶ膨らみましたが。。。まとめ力ないなorz 1.Buggy クラス AJAX magazine というサイトで公開されていたサンプルスクリプトで、クラス1つだけの小さなライブラリです。 以前、PHPプロ!ニュースでもご紹介した方法です。 この方法は、PHPのエラーをハンドリングし、その内容をscriptタグに出力し、console.info()を用いてFirebugのコンソールに渡す、という仕組みです。そのため、Firebugは必須です。 記事掲載当時は、buggy.class.phpがダウンロードできたのでしょうか

    FirebugでPHPをデバッグするツールまとめ
  • 1