DjangoでVS Codeを使う2つの方法。ローカル環境編。

VS Codeを用いて、ローカル環境でDjangoを開発する場合の環境設定を説明します。設定ではAnacondaを利用した場合と利用しない場合の2通りの方法を紹介します。リモート環境だけではなく、ローカル環境でもVS Codeを活用しましょう。

1.Anacondaを利用してVS Codeを使うメリット

Anacondaを利用してVS Codeを使う場合、Anaconda Navigatorを立ち上げてからVS Codeを起動するため、VS Codeの起動に時間がかかります。

しかし、Anaconda Navigatorから立ち上げるとターミナルが仮想環境に入った状態でVS Codeが起動するため、ターミナルで仮想環境に切り替える必要がありません。これは、特にDjangoでVS Codeを使う場合には便利な機能だと思います。

なぜなら、仮想環境でDjangoを利用する場合、仮想環境から「python manage.py runserver」を実行してWebサーバーを起動する必要があり、ターミナルで仮想環境に切り替える作業は必須だからです。

ただ、オールインワンのAnacondaの使用は好みが分かれるところだと思いますので、必要に応じて環境設定を行って下さい。

2.インストールのフォルダ構成

以下のようなフォルダ構成であると仮定します。

/Users
 │
 └user_name     #ユーザー名
   │
   └venvs       #仮想環境を集めたディレクトリ
     │
     ├py1       #仮想環境実行用フォルダ-1
     │ └.venv1  #仮想環境設定ファイル(仮想環境名)
     └py2       #仮想環境実行用フォルダ-2
       └.venv2  #仮想環境設定ファイル(仮想環境名)

3.Anacondaを利用しない方法

Anacondaを利用しない方法から説明します。

(1) セキュリティーポリシーの変更

Anacondaを利用しない場合には、PwerShellによってWindows10のセキュリティーポリシーを変更する必要があります。

Windowsのスタートメニューから Windows PwerShellを右クリックし管理者権限で開きます。そして、下記のコマンドを実行します。

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser -Force

詳しくは、以下で説明されています。

実行ポリシーについて(英語の記事)

(2) Pythonのインストール

Pythonのインストール方法は以下Python Japanで方法が紹介されています。

Windows版Pythonのインストール

インストールを実行するとPythonのプログラムは以下のフォルダにインストールされます。Python39の「39」の部分はバージョンによって変わります。

C:\Users\user_name\AppData\Local\Programs\Python\Python39

なお、複数のバージョンのPythonを同居させる場合にはPythonの実行ファイルへのPathは設定しません。

(3) 仮想環境の構築とDjangoのインストール

例として「py1」というフォルダに「.venv1」という仮想環境名の仮想環境を構築するものとします。

まず、コマンドプロンプトから仮想環境のフォルダに移動します。次に複数のPythonをインストールした場合は「python venv .venv1」ではなく「py -3.8 venv .venv1」により、Pythonのバージョンを指定します。ここで指定したバージョンのPythonが仮想環境で使用されます。

仮想環境への切り替えではLinuxでは「. .venb1/bin/activate」でしたが、windowsでは「.venv1\scripts\activate」となります。特に最初の「.」がないことに注意しましょう。

cd py1  #仮想環境のフォルダに移動
py -3.8 venv .venv1  #仮想環境の構築
.venv1\scripts\activate  #仮想環境への切り替え

仮想環境のインストール状況を確認し、pipをバージョンアップします。

python -V  #Pythonのバージョン確認
pip list  #インストールされたパッケージの確認
python -m pip install -U pip  #pipのアップデート

ここでは、matplotlibとdjangoをインストールしてみます。matplotlibは、2020/10/26時点ではPython3.9.0にはインストールできなかったので、Python3.8.6を使用しました。

python -m pip install matplotlib  #Matplotlibの
python -m pip install django  #Djangoのインストール
pip list  #インストールされたパッケージの確認

インストールされたパッケージの内容です。

Package         Version
--------------- ---------
asgiref         3.2.10
certifi         2020.6.20
cycler          0.10.0
Django          3.1.2
kiwisolver      1.2.0
matplotlib      3.3.2
numpy           1.19.2
Pillow          8.0.1
pip             20.2.4
pyparsing       2.4.7
python-dateutil 2.8.1
pytz            2020.1
setuptools      49.2.1
six             1.15.0
sqlparse        0.4.1

(4) VS Codeのインストール

Visual Studio Codeのダウンロード」からインストールファイルをダウンロードし、VS Codeをインストールします。

(5) VS Codeの設定

VS Codeの拡張機能「japanese Language Pack for Visual Studio Code」と「python」をインストールします。

VS Codeのエクスプローラーより「フォルダを開く」から「C:\Users\user_name\venvs」を選択します。

「左下の歯車」→「設定」→検索欄に「python.pythonpath」を入力し、「Python:Python Path」を見つけ出し、ワークスペースの設定で以下のファイルを指定します。

C:\Users\user_name\venvs\py1\.venv1\Scripts\python.exe

同様に、「左下の歯車」→「設定」→検索欄に「venv path」を入力し、「Python:Venv Path」を見つけ出し、ワークスペースの設定で以下のフォルダを指定します。

C:\Users\user_name\venvs\dj86\dj86v\Scripts

(6) Pythonの実行

VS Codeの左側のエクスプローラーより、ファイルhello.pyを作り、以下のコードを作成します。

print(Hello! Hello!')

「右上の緑の右三角印」や「F5」や「Ctrl+F5」によって実行できます。いずれも仮想環境で実行されます。

「F5」では、debugする言語の種類を問われますので、Pythonを選択します。

上のタブ「実行」→「構成を開く」を実行すると、次からはF5でもdebugする言語の種類を問われなくなります。

また、VS Codeの右下に「Linter pylint is not installed」と表示された場合はインストールします。

なお、ターミナルからpython hello.pyと実行する場合は、仮想環境に切り替わっていないので注意して下さい。

(7) Djangoの実行

VS Codeの右下のターミナルにより、django_appという名前のプロジェクトを作成し、webサーバーを起動します。

「右上の緑の右三角印」や「F5」や「Ctrl+F5」はPATHの設定により仮想環境を指定し、ターミナルはactivateコマンドによって仮想環境に切り替えます。それぞれ、仮想環境の指定が別なので注意してください。

cd py1  #仮想環境のフォルダに移動
py -3.8 venv .venv1  #仮想環境の構築
.venv1\scripts\activate  #仮想環境への切り替え
django-admin startproject django_app  #django_appという名前のプロジェクトを作成 
cd django_app  #フォnルダdjango_appに入る。
python manage.py runserver  #Webサーバーの起動

ブラウザより「http://localhost:8000/」、あるいは「http://127.0.0.1:8000/」にアクセスするとロケットの絵が表示されます。

なお、起動したwebサーバーを終了する場合には「Ctrl + C」とします。

4.Anacondaを利用した方法

次にAnacondaを利用した方法を紹介します。

(1) Anacondaのインストール

以下、Anacondaのインストール方法がPython.jpで紹介されています。

Windows版Anacondaのインストール

(2) Anacondaのアップデート

Windowsのスタートメニューより、「Anacond3」→「Anaconda Prompt」を起動し、以下のコマンドを実行します。

conda update conda  #condaのアップデート
conda update anaconda  #Anacondaのアップデート
conda update --all  #anacondaのライブラリのアップデート

なお、大きなアップデートがあったときには、以上のコマンドでは、うまくアップデートできないことがあるので、その場合はAnaconda自体をインストールしなおした方がよいです。

(3) Anaconda Navigatorによる仮想環境の構築

Windowsのスタートメニューより、「Anacond3」→「Anaconda Navigator」を起動します。

Anaconda Navigatorで仮想環境を構築するには、下図左側の①「Environments」を選択し、下側の②「Create」により仮想環境を作成します。すると、③に新しく仮想環境ができます。下の図は「myspace」という名前の仮想環境を作成した例です。

なお、「myspace」の表示の上の「base(root)」は仮想環境ではなく、元からあるベースとなる環境です。Anaconda Navigatorではこの画面から仮想環境にパッケージをインストールしたり、仮想環境のターミナルを起動したりできます。

01_仮想環境の構築

(4) VS Codeのインストール

Visual Studio Codeのダウンロード」からインストールファイルをダウンロードし、VS Codeをインストールします。

まだ、VS Codeは起動しません。起動している場合には終了してください。

(5) VS Codeを仮想環境で起動

Anaconda Navigatorを起動し、下図左側の①「Home」を選択します。次に上側のApplications onの右側②で起動する仮想環境を選択します。

最後に、VS Codeの下側③「Launch」をクリックするとVS Codeが起動します。この時、必要なVS Codeの拡張機能も自動でインストールされます。

なお、次回以降にVS Codeを起動するときも、Anaconda Navigatorから起動します。

02_VSCodeの起動

(6) VS Codeの設定

VS Codeの拡張機能「japanese Language Pack for Visual Studio Code」をインストールします。

VS Codeのエクスプローラーより「フォルダを開く」から「C:\Users\user_name\venvs」を選択します。

ターミナルが表示されていないので、上部タブ「表示」より「ターミナル」を選択します。

この時点で既にターミナルは仮想環境に切り替わった状態になっていますが、「ターミナル」と「緑三角、F5、Ctrl+F5」によるPythonの実行は仮想環境の指定が別なので設定によりPathを指定します。

なお、Windowsのユーザー名が「user_name」、仮想環境名が「py1」であるとします。以下、インストールの時に「All Users(requires admin privleges)」「Jast Me(recommended)」のどちらを選択したかによってPathの設定が異なります。

インストールの時にJast Meを指定した場合のPath

「左下の歯車」→「設定」→検索欄に「python.pythonpath」を入力し、「Python:Python Path」を見つけ出し、ワークスペースの設定で以下のファイルを指定します。

# base(root)で起動する場合。
C:\Users\user_name\anaconda3
# 仮想環境py1で起動する場合
C:\Users\user_name\anaconda3\envs\py1\python.exe

同様に、「左下の歯車」→「設定」→検索欄に「venv path」を入力し、「Python:Venv Path」を見つけ出し、ワークスペースの設定で以下のフォルダを指定します。

# base(root)で起動する場合。
C:\Users\user_name\anaconda3\Scripts
# 仮想環境py1で起動する場合
C:\Users\user_name\anaconda3\envs\py1\Scripts

インストールの時にAll Usersを指定した場合のPath

「左下の歯車」→「設定」→検索欄に「python.pythonpath」を入力し、「Python:Python Path」を見つけ出し、ワークスペースの設定で以下のファイルを指定します。

# base(root)で起動する場合。
C:\ProgramData\Anaconda3\python.exe
# 仮想環境py1で起動する場合
C:\Users\user_name\.conda\envs\py1\python.exe

同様に、「左下の歯車」→「設定」→検索欄に「venv path」を入力し、「Python:Venv Path」を見つけ出し、ワークスペースの設定で以下のフォルダを指定します。

# base(root)で起動する場合。
C:\ProgramData\Anaconda3\Scripts
# 仮想環境py1で起動する場合
C:\Users\user_name\.conda\envs\py1\Scripts

(6) Pythonの実行

VS Codeの左側のエクスプローラーより、ファイルhello.pyを作り、以下のコードを作成します。

print(Hello! Hello!')

「右上の緑の右三角印」や「F5」や「Ctrl+F5」によって実行できます。いずれもpathを指定した仮想環境で実行されます。

「F5」では、debugする言語の種類を問われますので、Pythonを選択します。

上のタブ「実行」→「構成を開く」を実行すると、次からはF5でもdebugする言語の種類を問われなくなります。

また、VS Codeの右下に「Linter pylint is not installed」と表示された場合はインストールします。

なお、ターミナルからpython hello.pyと実行する場合は、仮想環境に切り替わっていないので注意して下さい。

(7) Djangoの実行

django_appという名前のプロジェクトを作成し、webサーバーを起動します。Anaconda NavigatorからVS Codeを起動した場合は、ターミナルで仮想環境に切り替える必要はありません。

cd py1  #仮想環境のフォルダに移動
django-admin startproject django_app  #django_appという名前のプロジェクトを作成 
cd django_app  #フォnルダdjango_appに入る。
python manage.py runserver  #Webサーバーの起動

ブラウザより「http://localhost:8000/」、あるいは「http://127.0.0.1:8000/」にアクセスするとロケットの絵が表示されます。

なお、起動したwebサーバーを終了する場合には「Ctrl + C」とします。

私が実際にレンタルしたVPSサーバー

私が実際にレンタルしたVPSサーバーはConoHa VPSです。私は1GBのプランを申し込みました。VPSサーバーは一般のレンタルサーバーと異なりOSやアプリケーションを自由に設定できるので、Pythonで計算した結果をサイトに表示することもできます。

なお、ConoHa VPSの特長として、サーバーのディスクイメージを丸ごとバックアップできるイメージ保存機能を無料で使用することができます。コードを変更して元に戻せなくなった場合にも安心です。

また、ConoHa VPSは途中でプランをスケールアップできるだけでなく、スケールダウンすることもできます。つまり、2Gプランを1Gプランに変更することができます。ただし、512MBプランだけはスケールアップ・ダウン機能が使用できないので注意してください。

また、初期費用なしで3日だけ借り、3日分の費用だけ払うといったことも可能なので気軽に始められます。※時間課金(月の上限額は決まっています)



その他

Twitterへのリンクです。SNSもはじめました♪

以下、私が光回線を導入した時の記事一覧です。
 (1) 2020年「光回線は値段で選ぶ」では後悔する ←宅内工事の状況も説明しています。
 (2) NURO光の開通までWiFiルーターを格安レンタルできる
 (3) NURO光の屋外工事の状況をご紹介。その日に開通!
 (4) 光回線開通!実測するとNURO光はやっぱり速かった
 (5) ネット上のNURO光紹介特典は個人情報がもれないの?