世界を旅して人生を楽しもう。今回から「技術塾」と題して主に初心者向けに基本的な技術情報を提供するカテゴリを作りました。最初の内容は、NodeJSアプリケーション開発において必須のスキルであるデバッグです。デバッグのできないプログラマなんて、寿司の握れない板前、英会話のできない英語教師、ホームランの打てない4番バッター、はたまた、メダルを逃したオリンピック選手(これはちょっと違うか)、例えたら切りが無いですね。今回はそんな残念なNodeJSプログラマにならないために、基本となる3つのデバッグ方法を紹介します。関連記事はじめにNodeJSに限らずデバッグはプログラマ、エンジニア、デベロッパーにとって必ずマスターしなければいけないスキルの一つです。そのスキルが無いと、バグが発生した時に原因を突き止めて改修することが事実上不可能だからです。今回はNodeJSの初心者を対象として、基本となる3つのデバッグ方法を紹介しますので、必ずマスターしましょう。デバッグの0番目の方法としてconsole.logがありますが、当たり前なので書きません。基本の3つのデバッグ方法デバッグ用のソースコードの準備それではデバッグを試すためだけの簡単な環境を準備しましょう。debugging.js「debugging.js」は以下にします。Cruise'};console.log(puppy);単にオブジェクトをコンソールに出力するだけのコードです。標準のデバッガーでのデバッグ1つ目は「debugger」と「inspect」コマンドを使うコンソールでのデバッグ方法を紹介します。これはnode-inspectという機能で、NodeJSには最初から搭載されています。やり方はアナログですが、ブレークポイントを設定したい場所に「debugger」を書きます。inspect」コマンドにより、デバッグを開始します。「c」コマンドにより、ブレークポイントまで進みます。ブレークポイントで停止した状態で、「repl」コマンドを実行することで、値を確認したり、値を変更したりできます。今回はpuppyのfeelingをheartからrelaxedに変更しました。確認や変更が終わったらControl+Cでこのモードから抜けます。「c」コマンドを実行すると他にブレークポイントが無いので終了します。値を変更した箇所は変更されたままで出力されていることが確認できます。「.exit」でデバッグを終了します。デバッグ時のコマンドは以下です。ポーズ今回使ったのは「c」コマンドだけですが、詳しくは公式ドキュメントを参照して下さい。Chromeでのデバッグ2つ目はCromeのDevToolを使ってデバッグ方法を紹介します。NodeJSがJavascriptであることを活かしたデバッグ方法です。Chromeを開き、「chrome://inspect/」を表示します。–inspect-brk」を実行しましょう。Targetが表示されます。Node」のリンクをクリックします。するとChromeのデバッグ画面が表示されます。試しに、コンソールのデバッグでやったのと同じことをしてみましょう。デバッグ画面からブレークポイントを設定します。ソースコードの横をクリックするだけです。右上の三角のボタンをクリックするとデバッグが開始されます。以下のようにブレークポイントで止まり、値を確認できます。Chromeのコンソールから値を確認することもできます。今回はfeelingの値をcycloneに変更しました。一度右上の三角ボタンをクリックすると、他のブレークポイントが無いので、デバッグが終了します。コンソールに結果が出力されています。この方法はかなり便利で、特にnodemonでアプリケーションを起動している場合は、ソースコードを変更してすぐに、デバッグの画面が更新されてます。node-inspectよりはるかにデバッグが簡単です。Codeを使ったデバッグ方法を紹介します。Codeで開き、左側の虫のようなアイコンをクリックします。するとデバッグ画面が表示されるので、上の「構成がありません」をクリックします。「構成の追加」を選びます。「環境の選択」には「Node.js」を選びます。すると「launch.json」というデバッグ設定ファイルが自動生成されます。今回は単にデバッグモードで実行できれば良いので、デバッグ設定ファイル(launch.json)は以下のように設定します。]}後は、Chromeの時と同じようにデバッグできます。ソースコードの右側をクリックして、ブレークポイントを設定します。デバッグボタンをクリックするとデバッグが開始されます。ブレークポイントで止まっている状態では以下のようになっています。それでは、先ほどと同じように値を変更してみます。デバッグコンソールからChromeの時と全く同じように値を扱えます。値の確認と変更が終わったら、上にある三角のボタンをクリックすれば、実行が再開されます。デバッグコンソールに結果が出力されて、デバッグが終了しました。Codeのエディタ上でコーディングからデバッグまで完結させることができ、大変便利です。これが一番オススメの方法です。Codeの公式サイトを参照して下さい。最後にいかがでしたか?これでNodeJSのデバッグ方法の基本はマスターできたと思います。自分の関わったアプリケーションで障害が出た時に、華麗にデバッグして原因を究明し、ささっと改修してプロの仕事を見せつけましょう。最新の記事KD世界を旅し日本を愛するエンジニア。大学でコンピュータサイエンスの楽しさを学び、日本の大手IT企業で働く中で、新しい技術やスケールするビジネスが北米にある事に気づく。世界に挑戦するための最大の壁が英語であったため、フィリピン留学およびカナダ留学を経て英語を上達させた。現在は日本在住でエンジニアとして働きつつ、次の挑戦に備えて世界の動向を注視している。このブログでは、エンジニアやデザイナー向けの技術情報から、海外に留学したい人向けの留学情報、海外に興味がある人向けの海外旅行情報など、有益な情報を提供しています。最近はITの情報は全て英語で仕入れるようになりました。英語ができるからではありません。Electronが面白くて仕方がないです。ビルド編Congratulations!!ここまでお疲れ様でした。MacでRubyとPythonとJavaとNodeとPerlの複数バージョンを管理する方法iPhone6sですか?予約しました、Keidです。今月で20代ラストの年になってしまいました。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。AuthorKD世界を旅し日本を愛するエンジニア。大学でコンピュータサイエンスの楽しさを学び、日本の大手IT企業で働く中で、新しい技術やスケールするビジネスが北米にある事に気づく。世界に挑戦するための最大の壁が英語であったため、フィリピン留学およびカナダ留学を経て英語を上達させた。現在は日本在住でエンジニアとして働きつつ、次の挑戦に備えて世界の動向を注視している。このブログでは、エンジニアやデザイナー向けの技術情報から、海外に留学したい人向けの留学情報、海外に興味がある人向けの海外旅行情報など、有益な情報を提供しています。0.0010このブログの運営のためにBitcoinでの寄付を募集しています。お気持ち程度の寄付を頂けると管理者の励みになります。最新の記事KD世界を旅し日本を愛するエンジニア。大学でコンピュータサイエンスの楽しさを学び、日本の大手IT企業で働く中で、新しい技術やスケールするビジネスが北米にある事に気づく。世界に挑戦するための最大の壁が英語であったため、フィリピン留学およびカナダ留学を経て英語を上達させた。現在は日本在住でエンジニアとして働きつつ、次の挑戦に備えて世界の動向を注視している。このブログでは、エンジニアやデザイナー向けの技術情報から、海外に留学したい人向けの留学情報、海外に興味がある人向けの海外旅行情報など、有益な情報を提供しています。最近はITの情報は全て英語で仕入れるようになりました。英語ができるからではありません。Electronが面白くて仕方がないです。ビルド編Congratulations!!ここまでお疲れ様でした。MacでRubyとPythonとJavaとNodeとPerlの複数バージョンを管理する方法iPhone6sですか?予約しました、Keidです。今月で20代ラストの年になってしまいました。