タグ

Firebugに関するtacarzenのブックマーク (9)

  • FirefoxのJavaScriptデバッガ拡張Firebugの進化がすごい

    Firefoxのデバッグ拡張ことFirebugですが、Firefox4よりFirebugとは別にWeb Consoleという機能が入りました。 しかし、Firebug自体もさらに便利になっているので、少し紹介します。(Firebug1.7 –1.8 の範囲で) 現在のFirefox4に正式対応しているのはFirebug1.7xで、Firebug1.8xはAlpha版として公開されているのでまだ不安定な部分もあることに注意して下さい。 特に注意書きしてない部分はFirebug1.7の項目だと思って大丈夫だと思います コマンドラインに履歴ボタン コンソールパネルでのコマンドエディタ(でかい方のコマンドライン)にHistoryボタンが新たに追加されました。 過去に実行したコマンドをポップアップから選択して挿入することができます。(以前はCtrl+ZでUndoし続ける必要があった) コマンドライン

    FirefoxのJavaScriptデバッガ拡張Firebugの進化がすごい
  • Firebugの使い方 | THE HAM MEDIA

    Webサイト制作をしている方には、必需品なんじゃないかと思われるくらい便利なFirefoxのアドオン『Firebug』。HTMLCSSのコーディングを担当している人の多くはいれているアドオンですね。 Firebugを入れて使っている人は多いようなのですが、意外と知られていない機能が盛り沢山だったということが、先日の勉強会(SaCSS)にて発覚!使っているといっても、一部の機能に限られてしまっているようなのです。 もちろん「そんな機能知ってるよ!」というくらい使っている人も多いと思います。しかし、そんなに使いこなせていないや、活用できていない!という人も勉強会の時に多かったように、実際にも多いはず! Firebugの使い方をもう少し知っていると、Webサイトの制作の時に便利だ!と思える場面が多々でてくるので、是否今回ご紹介する機能は抑えておき、活用してみてください。 HTML&CSSの確認

    Firebugの使い方 | THE HAM MEDIA
  • Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC engineers' blog

    羊毛布団を洗濯機にかけられないことを知りました。ago(@kyo_ago)です。 意外と知られていない機能が多い!?Firebugの使い方を見て、プログラマ向けも欲しくなったので書いてみました。 1. ショートカット一覧 以下のページでFirebugのショートカット一覧が公開されています。 http://getfirebug.com/wiki/index.php/Keyboard_and_Mouse_Shortcuts 取り合えず以下の二つだけでも覚えておくと効率的かもしれません。 F12でFirebugの有効、無効の切り替え 広いコマンドラインモード時にCtrl+Enterでコードを実行 また、以下のメニューからショートカットの変更も行えるので、他の拡張等とショートカットがかぶった場合でも別のキーで使用することが出来ます。 2. Firefox体のツールバーに「要素を調査」ボタン Fi

    Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC engineers' blog
  • 第2回 Firebugによるデバッグの基本、Console APIとその活用 | gihyo.jp

    さて、前回はインストールからFirebugのタブの基的な部分について紹介をしてきました。今回は、Firebugに実装されているConsole APIの紹介と、Console APIを利用したデバッグ手法について解説していきます。 Firebugで利用できるAPI Firebugには、デバッグに活用できる2つのAPIが実装されています。今回は、その2つあるAPIのうちConsole APIについて解説していきます。 Console API Console APIはFirebugのタブだけでなく、コンテンツ側のJavaScriptから呼び出すことのできるAPIです。デバッグのために便利な関数があらかじめたくさん用意されています。これらの関数を以下に列挙しますので、目を通してください。 console.log(object[, object, ...]) 渡された全てのオブジェクトをconso

    第2回 Firebugによるデバッグの基本、Console APIとその活用 | gihyo.jp
  • FirePHPを用いた、スクレイピングデバッグに関する考案 - 例えば、PHPを使う

    今回は、架空のサイトevents.php.bunko.jpを対象にスクレイプ&spidering対象にします。 仮に、勉強会の参加回数を聞かれて答えに窮する状況があったとします。 参加回数の表示機能は、カリオストロ城の奥地に眠っているらしくすぐに使うのは困難なようです。 特定のメンバー名だけならすぐにカウントできそうですが、メンバー一覧を取得しDBに格納したいものです。 取得する主な対象は、メンバー一覧ですが、発表タイトルでどのように参加状況が変わるかも調べてみたいとします。 <?php //発表タイトル $titles = new Diggin_Scraper_Process(); $titles->process('//h4', 'title[] => TEXT'); //参加者 $members = new Diggin_Scraper_Process(); $members->pr

    FirePHPを用いた、スクレイピングデバッグに関する考案 - 例えば、PHPを使う
  • CakePHP のデバッグ出力を FirePHP で表示する。 - FICC LABS

    たけしです。 CakePHP で開発をしている時は、core.php のデバッグレベルを2とか3とかにして開発をしているのですが、これがhtmlの最後の方にブリッと大量に吐かれて案外邪魔です。 そこで FirePHP (FireBugのPHP版のようなもの)を導入して、consoleタブ色々なデバッグ情報を出力してみます。ちなみにPHP5限定です。 [ 用意するもの ] ・Firefox の2か3 ・FireBug ・FIrePHP ・FirePHPコアライブラリ [ インストール手順 ] 1. FirePHP.class.php を /app/vendors に配置します 2. /cake/libs/model/datasources/dbosource.php を 任意のAPPディレクトリ/model/datasources/dbosource.php にコピーします 3. dbo_

  • 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

  • ウェブ制作にかかせない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の機能を更に強化する機能拡張集 | コリス
  • Windows版『Firebug』の文字化けを解消する

    サイト構築時に重宝しているFirefoxのアドオン『Firebug』。ずいぶん前から使ってはいるのだが、いくらヴァージョンが上がっても日語化されても解消していない問題があった。 それは、HTML解析ウインドウ(と言っていいのか分からないが)の文字化け。こんな状態で出てくる。 「firebug 文字化け」でググってもこれといった情報が現われずあきらめていたのだが、ふと「firebug font family」で検索してみたら解決法らしきサイトを見つけたので書き留めておこうと思う。 Firefoxのプロファイルフォルダの中にある extensions\firebug@software.joehewitt.com\skin\classic\html.css というCSSファイルの10行目を font-family: Monaco, monospace; から、希望するフォント名に書き換えるのが

  • 1