Dockerで作ったDjangoプロジェクトをVisual Studio Codeで開く

今まで、Visual Studio2019でDjango開発してましたが、Visual Studio CodeだとDocker対応してるみたいなんで、やってみました。

こういったのは、多分すぐ忘れるので残しとかないとね。

Visual Studio Codeのインストールから

サイトに行って、ダウンロードしてきましょ。

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

今回は、WindowsのUser Installer版をダウンロード

インストーラ実行

そのまま、次へ次へ。。。無事インストール完了。

Extention周りをインストールします。

VSCodeは、Extentionいっぱいあって、楽しいかも!

ここで紹介した以外にも、色々あるので、当分楽しめそうね~😁

Remote -WSL (結局、使わなかった)

で、起動したら、下記メッセージ

そう言えば、Dockerインストールする時に、WSL2を入れてました。

便利そうなので、Installボタンクリック。

Docker

検索して、Dockerもインストールしておきましょう。

アイコンすぐ右のInstallボタンをクリック(緑のやつね)

左のアイコン並んでる所に、くじら出てきましたね~

クリックしたら、CONTAINERSの所に用意したコンテナいますね。

コンテナ上で右クリックすると、、、

ここで、コンテナの操作できるんですね。便利じゃないか!

Remote – Containers

Dockerのコンテナに、接続するやつ!

いつもどおり、インストールして~

Docker Containerに接続!

VSCodeの左下の、><をクリックすると、、、、

どこに接続しますの??と、

で、Remote-Containers: Attach to Running Container… をクリック

Djangoが入ってる方(上)を選択、

別Windowが開いて、左下の方にメッセージが。多分うまく行ってるのかな??

こっちはこっちで、Extention入れないとダメなのね

こっちの環境の方にも、Python Extention入れておきましょうか!

Install in Container ***の所をクリックして、インストール

ちょっとしたら、Install in Container ***のところが、Reload Requiredに変わったので、クリック。

再度読み直ししたとおもったら、下のメッセージ。

PythonのVersion指定しろと??

最新の、3.8で行きます

コチラも、Installします。

デバッグしてみますかね~

Djangoプロジェクトのパス指定

ターミナルを立ち上げて、

フォルダを検索してみたら、どうも /codeって所に、Djangoのフィアル郡があるもよう。

デバッグの画面に遷移して、open a folderをクリックすると、

Djangoプロジェクトの設置パスを指定しろと。manage.pyがあるフォルダ。

指定して、OK

デバッグ用のJsonファイル作成

今度は、create a launch.json file.をクリック

Djangoをクリック

できた~

よし!早速適当な所に、ブレークポイント貼って、 Run and Debug

ま、そっか~。コンテナ起動の時に、Django立ち上がってますよね~。

launch.jsonに、赤字の1行追加しました。

デバッグの時は、PORTを違うので動かします。

{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Python: Django",
"type": "python",
"request": "launch",
"program": "${workspaceFolder}/manage.py",
"args": [
"runserver",
"0.0.0.0:8001",
"--noreload"
],
"django": true
}
]
}

そして、再度デバッグ実行!

来た~~

今回はここまで。

次は、AWSにDocker Container乗っけて見ますかね。

関連コンテンツ