edump

dump everything live
Fast, Easy & Free!

始めよう！edump

さぁ 始めよう！edumpでデバッグ効率アップ！

簡単チュートリアル

http://www.edump.net/

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

1. edumpはウェブプログラミング方向けの簡易デバッガです。
edumpは様々なプログラム中の情報や変数の値を貴方のインターネットブラウザにリアルタイムで表示します。色々プログラミング言語でいつでも使えます。もう複雑なデバッグ環境の準備やサーバーへのインストールは必要ありません。さぁ！始めてみよう！

2.新しくアカウントを作る
貴方のアカウントを登録しましょう。お使いのメールアドレスを入力してください。
クリック

貴方のメールアドレスを登録

システムへのログインパス
ワードはメール経由でお知らせします。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

3. edumpへログインしよう

ここに登録したメールアドレ
スとパスワードを入力してください

ログインするとこのようなページが表示されます。

4.ログウィンドウを開きましょう。最初は何も表示されていませんが、このウィンドウを閉じずに次のステップへ。

このボタンをクリック

このウィンドウは閉じないで。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

5.テストメッセージをログウィンドウに送ってみよう！

おめでとうございます。ログウィンドウに入力したメッセージが表示されました。

メインウィンドウのこのエリアに何か文字を入力してください。

送信ボタンを押してください。

6. 次に例えばPHPでedumpの機能を確認してみましょう. Home画面の「[ PHP ] で使えるedumpの機能一覧とコードサンプルです。」のテキストエリアにあるコードをコピーして、貴方のPHPファイルに貼り付けてください。

PHPを選択ここをクリックしてコピー開発環境のエディタにソースコードに貼り付ける

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

この赤色の部分はedumpの初期化
コードです。この部分を貴方のPHPコードの共通開始部分に記載すれば、いつでもedumpのコマンドを使えますedumpで使える初期設定と関数の説明、サンプルが記載してあります。
一読をお願いします。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

7. PHPが動作する貴方のウェブサーバーに先ほどの“サンプルPHPファイル"をアップロードしてください。

アップロード8.アップロードした”PHPファイル”にブラウザでアクセスしてください。貴方のログウィンドウにメッセージも送信されているはずです。これでチュートリアルは完了です！edumpのコマンドは貴方のプログラミングコードの何処でも使用出来ます。

サンプルコードが実行されて、貴方のログウィンドウにログが表示されます。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

edumpビューワー機能解説edumpdump everything live
Fast, Easy & Free!

始めよう！edump

edumpのビューワーには色々な機能が搭載されています。それぞれの機能を確認していきましょう。

貴方の送ったデータが確認出来るエリアです。

データのステータスが表示される「ラベルエリア」です。

新しいedumpのウィンドウを開きます。

このアイコンをクリックすると、ビューワーにデータが再読込されます。

簡易的に絞り込み検索が可能です。

このアイコンをクリックすると、ビューワー上のデータがクリアされます。

設定画面を開きます。

ウィンドウのスクロールを一番上に移動します。
簡易的にedumpにメッセージをビューワーから直接送れます。

各言語ごとに初期化コードがここからコピー出来ます。内容は設定画面と同様です。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

システム設定でedumpのビューワーの動作を設定出来ます。お好みの動作環境に設定しましょう。

ビューワーがデータを受信した時に効果音を鳴らすかどうか設定出来ます。
マイページのユーザー設定を選択してください。

ビューワーがデータを受信した時にブラウザのデスクトップ通知を表示するかどうかを設定出来ます。
メッセージラベルに詳細情報を表示するかどうかを設定出来ます。実行ファイル名や行番号、タグ等の詳細情報を確認する為には有効にする必要があります。画面をコンパクトに使用したい時にはOFFがオススメです。
詳細に確認したい時はONにします。

デバッグ対象になっている貴方のプログラムとedumpのサーバーを通信する時にSSL接続を使うかどうかを設定出来ます。
edumpビューワーは初期化コード等がロードされた時に、右下にedumpのモジュールが読み込まれた事をメッセージラベルで表示しま
すが、そのメッセージラベルの表示時間と同時表示個数を設定出来ます。

edumpビューワーの右下に表示されている初期化
コードコピーボタンの表示言語を指定出来ます。メインの言語だけの表示がオススメです。

edumpdump everything live
Fast, Easy & Free!

もっと便利に活用しよう

始めよう！edump

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

Google ChromeやFireFoxをお使いの方はedump用の機能拡張をご利用頂けます。インストール後はブラウザのデベロッ
パーツールにedumpの機能がインストールされます。一つのウィンドウでメインであるウェブサイトとedumpのデータが表示され、開発効率が著しく向上するでしょう！機能拡張へのリンクはマイページのシステムツールにあります。

システムツールを選択ブラウザを選択してください。機能拡張の紹介ページにリンクします。現在GoogleChromeとFireFoxに対応しています。

ブラウザに機能拡張をインストールするとedumpがブラウザの開発者ツールから使えるようになります。
メインのWebページとedumpウィンドウが同時に使える様になり、非常に便利です。

edumpdump everything live
Fast, Easy & Free!

始めよう！edump

WordPressでのデバッグ用にプラグインも用意されています。

貴方のedumpのIDをセットすれば、WordPress内部のエラーを自動的に取得ししたり、テーマ制作やプラグイン開発でedumpの関数が使えるようになります。

WordPressの公式プラグインディレクトリで「edump」を検索してからもインストール出来ますedumpdump everything live
Fast, Easy & Free!

始めよう！edump

Tag Styleのページを開くと開発言語ではありませんが、画像やCSS等のタグからedumpのデータがビューワに送信出来るサンプルが掲載されています。HTMLページに貼り付ける事で、簡易的にアクセスがあったことを確認出来ます。

各種貼り付け方のサンプルコードです。

httpからのアドレスでアクセスする事で簡易的にedumpのデータを送る事も出来ます。