Django ハンズオン~環境構築編~

# 準備しておくもの

- Python、ライブラリのインストール
    - Python 3.6(Djangoとの相性の関係上3.5以上のPythonをインストールしてください)
    - Django 2.2.5 (こちらは微妙に書き方が変わる場合があるのでできる限り合わせてください。

- エディタ類
    - Visual Studio Code (今回のハンズオンではこれを使用します。）
    - 拡張機能
        - Python:ms-python.python
        - Django:お好みで
        - SQLite:alexcvzz-sqlite


上記の環境が構築できている方は、「プロジェクトの準備(ディレクトリ作成～Djangoのインストールまで)」の章に進んでください。

すでにインストールしているPythonのバージョンが古い場合、特にこだわりがなければ一旦古いPythonをアンインストールして、再度新しいPythonのインストールを行いましょう。

# Pythonのインストール

Pythonのインストールには、下記の2通りあります。
- Anacondaを利用する方法
- Python.orgから直接ダウンロードする方法

すでにどちらかでインストールしている場合はそのPythonを使用してください。

未インストールの方は、もし機械学習など統計・科学技術領域に興味があり、Pythonをそういった領域に使用したい場合はAnaconda使ったインストールを行ってください。

ハンズオンではPython.orgのpythonを使用します。
(annacondaは統計・機械学習などには適しており環境がすぐに用意できる点優秀ですが、少し外れたことをすると環境構築で泣きを見ることになります）

インストール方法については、すでに多くの記事が書かれているので割愛します。
***ただし、インストールするPythonのバージョンには気をつけてください。***
Dockerを使用した環境構築の記事も見かけると思いますが、慣れていなければつまづきポイントを増やしかねないためやめたほうが賢明でしょう。

# VisualStudioCodeのインストール

VisualStudioCode 略してVSCodeと記述されることが多いです。
似た製品にVisualStudioがあります。たまに混同されている方がいるので確認してください。

インストール方法はGoogle先生に「VSCode　インストール」と聞いてみましょう。
Microsoftのサイトに当たればあたりです。特に導入躓くことはないかと思います。強いて上げるならPATHを通すかどうかのチェックボックスがあるので、通しておくとターミナルから一発で開くことができて便利です。

参考のQiita記事です.[ [VScodeのインストール手順@Windows10](https://qiita.com/Shi-nakaya/items/c43fb6c1e638d51bf1c8)] 

その他は特に何もありません。インストーラを実行するだけで終わるでしょう。

# 拡張機能の追加

VSCodeを開くと左端に並んでいるアイコンの一番下（環境による）をクリックしましょう。
![vscode..PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/251535/a6f700f9-f791-8da3-037f-19a9bd90cdac.png)

下記の拡張機能を追加します。検索する際は、Pythonと検索しても、ms-python.pythonと打ってもどちらでも構いません。
前者は今回導入する拡張機能以外にもPythonに関連する拡張機能がズラッと並びます。後者は今回導入する拡張機能のみが表示されます。

##### 今回追加する拡張機能
- Python:ms-python.python
- Django:お好みで
- SQLite:alexcvzz-sqlite


## プロジェクトの準備(ディレクトリ作成～Djangoのインストールまで)


どこか適当にディレクトリを作成してください。
そこに仮想環境を作成していきます。

Pythonの仮想環境作成の選択肢はいくつかありますが、今回は一番シンプルなvirtualenvを使用します。
作成したディレクトリに入り、``python -m virtualenv myenv``と入力します。
``myenv``は任意の名前で構いません、単に仮想環境の名前です。

仮想環境を作成した後のディレクトリ構造は以下の通りです。(Windowsはフォルダ構成が異なります）

```
(myenv)~/Project/django_handson$ tree -d -L 2
.
└── myenv
    ├── bin
    ├── include
    └── lib
```

仮想環境を作成後(ディレクトリが作成されたことを確認してから）、以下のコマンドをたたいてください。
##### Mac/Linuxの場合
```
$ source myenv/bin/activate
(myenv) $　#(myenv)という表示が出れば設定完了です。
```

##### Windowsの場合
```
> myenv/Scripts/Activate
(myenv) >　#(myenv)という表示が出れば設定完了です。
```




ここにDjangoをインストールしていきます。
``pip install django==2.2.5``と入力します。``==2.2.5``は省略可能ですが、今回のハンズオンではつけておいてください。

ここで環境自体にはDjangoというフレームワークは入りましたが、まだWebアプリ自体は作成されていません。
これからDjangoアプリケーションを作成していきます。

アプリケーションの作成には``django-admin``コマンドを使用します。
コンソール上で``django-admin startproject config .``と入力しましょう。
``config``はプロジェクトの名前になります。``config``と``.``の間にスペースを入れることを忘れないようにしてください。（不安な方はコピペしましょう）

コマンドを入力しても何も表示されないですが、それで正解です。
作成後のディレクトリは以下のようになっているはずです。

```
.
├── config　          #追加
│   ├── __init__.py 　#追加
│   ├── settings.py　 #追加
│   ├── urls.py 　    #追加
│   └── wsgi.py　     #追加
├── manage.py         #追加
└── myenv
    ├── bin
    ├── include
    └── lib
```

正しくDjangoがインストールされたかを確認するために、試しに動かしてみます。
コンソール上で``python manage.py runserver``と打ってください。
Warningが出ますが、後で対処しますので気にしなくて大丈夫です。

```
(myenv):~/Project/django_handson$ python manage.py runserver
Watching for file changes with StatReloader
Performing system checks...

System check identified no issues (0 silenced).

You have 17 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
Run 'python manage.py migrate' to apply them.

September 28, 2019 - 17:08:34
Django version 2.2.5, using settings 'config.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
```

表示にもある通り、デフォルトでは[http://127.0.0.1:8000/](http://127.0.0.1:8000/)でサーバーが上がります。
以下ような画面が表示されればインストールは成功です。

![install_django.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/251535/08b93666-7e8a-0905-cf8b-1e3e1a5200f0.png)


表示が確認できれば、``ctrl+c``でサーバーを停止してください。
ここまででDjangoのインストールは完了です。

[続くWIP]()