"BOKU"のITな日常

62歳・文系システムエンジニアの”BOKU”は日々勉強を楽しんでます

Djangoアプリの動作確認・デバッグ実行にVisual Studio Codeを利用する:Windows10・python3

開発環境「Visual Studio Code」(以後VsCode)で、python3+djangoの開発と、Webアプリケーションの実行・デバッグのやり方を確認します。

f:id:arakan_no_boku:20190425233546j:plain

 

前提の説明

 

OSは、Windows10です。

・PCにAnacondaがインストールされていること。

Djangoもインストールされていること。

VsCodeのインストールと、Python・Anacondaのエクステンションのインストールなど、こちらの記事の手順が終わっていること。

arakan-pgm-ai.hatenablog.com

以上が、今回の前提です。

Djangoのインストールがまだの場合は、こちらを参考にして、やっておいてください。

arakan-pgm-ai.hatenablog.com

 

djangoの開発に特別な追加設定は必要ありません

 

Python単体の実行・デバッグができる環境ができていれば、django用に特別に追加することはありません。

Djangoはプロジェクトを作る時に、「django-admin startproject hello」などとやって、プロジェクトフォルダを生成して開発するスタイルです。

カレントフォルダに「hello」というフォルダができます。

このhelloフォルダを「フォルダを開く」時の対象にしておくと、.vscodeフォルダに保存した設定がdjangoプロジェクト全体をカバーする形になります。

 

Djangoアプリケーションの実行

 

動作確認のために、VsCodeのターミナルを使って、Djangoのビルトインサーバーを動かしてみます。

まず。

適当なdjangoプロジェクトを選んでフォルダを開きます。

既存のプロジェクトがないときは、以下を参考にdjangoプロジェクトの生成だけやってておいてもらえれば、手順はできます。。

arakan-pgm-ai.hatenablog.com

続いて、コマンドパレットを開きます。

Ctrl+Shift+P を押すか、右クリックメニューの「コマンドパレット」です。

ここで「pythonインタープリターを選択」を選び、djangoをインストールしている仮想環境を選択します。

f:id:arakan_no_boku:20190427102235j:plain

あとは。

ターミナル>新しいターミナルで、ターミナルを開きます。

f:id:arakan_no_boku:20190427102440p:plain

ターミナルが立ち上がって、選択した仮想環境のActivateまで自動でしてくれます。

そこで、以下のコマンドを打ち込んで、djangoサーバーを動かします。

python manage.py runserver

で。

こういう表示になれば動いてます。

f:id:arakan_no_boku:20190427102737p:plain

あとはブラウザを開いて、URLでアクセスします。

自分は今回、以下の記事の時の環境を使ってます。

arakan-pgm-ai.hatenablog.com

なので、「http://localhost:8080/demo」みたいな感じでアクセスしました。

f:id:arakan_no_boku:20190427103022p:plain

動いてますね。

じゃ、ターミナルで「Ctrl+C」を入力して、終わらせときます。

 

デバッグの手順です

 

WebアプリケーションのDebugの手順です。

といっても。

動かし方が違うだけですけどね。

メニューの「デバッグデバッグの開始」で、以下のリストを開いて、「Django」を選びます。

f:id:arakan_no_boku:20190427103525p:plain

そうすると、デバッグモードでさっきの実行時と同じようにサーバーが立ち上がるので、動かすのはブラウザでURLをたたく同じ方法でOKです。

ブレイクポイントを仕掛けたい行を選択して、F9キーを押します。

f:id:arakan_no_boku:20190427103825p:plain

ブレイクポイント行に赤丸がつきます。

あとは、普通にブラウザで動かすと、ブレイクポイントで止まりますから、ステップ実行して変数等の値を確認してデバッグをすればいいです。

f:id:arakan_no_boku:20190427104942p:plain

 ちなみに、アイコンですが。

f:id:arakan_no_boku:20190427012235j:plain

左から。

  • 続行
  • ステップオーバー
  • ステップイン
  • ステップアウト
  • 再起動
  • 停止

となっています。

これで、VsCode上でDjangoアプリケーションのデバッグができます。

ちなみに。

ステップインは基本的に1行単位で実行されます。

関数呼び出しの行だと、その関数の内部にはいっていきます。

当たりをつけたメソッドの中の問題をピンポイントで見つけるときとかに使います。

ステップオーバーも1行単位で実行されます。

ステップインと違い、関数があった場合その関数を実行して次の行に移行します。

通常、ブレイクポイントで止めてから、ステップオーバーで問題のある個所(関数)にあたりをつけて、ステップインして原因を掘り下げる・・みたいな感じになります。

ステップアウトは実行中の関数の外(呼び出し元)に出るまでプログラムを進めます。

関数の動作チェック中に呼び出し元に戻りたい時に使えます。

続行は、文字通りブレイクポイントで止めたところから、アプリケーションの実行を再開します。

ループ中の特定データでのみ問題が発生するようなケースだと、ループ中のエラーが発生している行の上あたりにブレイクポイントを仕掛けて、続行の連打で、エラーが発生するデータにあたりをつけたりとかします。

てな感じですかね。

ではでは。