Djangoチュートリアル的なもの


こんにちは！
[情報通信システム工学科アドベントカレンダー](https://qiita.com/advent-calendar/2018/ics2018)の３日目やってまいりました〜

情報通信システム工学科三年の吉田ことたつぱかです！
先日はほのさん(@hnk1031 )に[女子大生っぽい記事](https://qiita.com/hnk1031/items/e791f31ffaaee8cf6ea7)を書いていただきました！
~~クリスマスカラーのターミナルをみて、もうクリスマスの時期なのかと一人嘆いていたのは内緒。~~

さて本日ですが、
自身が一番最初に勉強したWebアプリケーションフレイームワークDjangoの書き方のようなものを記事にしていこうと思います。
ざっくり書くので、説明不足な点が色々あるとは思いますが、温かい目で見守ってください。

>pythonの環境構築ができていてpipが使える前提でお話します。
Anaconda環境でもpipをcondaに置き換えてコマンドを入力することでできるとは思いますが、
モジュールのバージョン管理がどのようになってるのかがわからないので、下調べすることを推奨します。


## 今回紹介すること
- [Djangoって何？](https://qiita.com/Yoshida_kun/private/7b1680952786a53259cf#django%E3%81%A3%E3%81%A6%E4%BD%95)
- [Django導入](https://qiita.com/Yoshida_kun/private/7b1680952786a53259cf#django%E5%B0%8E%E5%85%A5)
- [初期ページ作成](https://qiita.com/Yoshida_kun/private/7b1680952786a53259cf#%E5%88%9D%E6%9C%9F%E3%83%9A%E3%83%BC%E3%82%B8%E4%BD%9C%E6%88%90%E3%81%BE%E3%81%A7)

合わせてこちらにもオススメのチュートリアル記事が乗っているのでご参照ください
[Python Django 入門(1)](https://qiita.com/kaki_k/items/511611cadac1d0c69c54)
[Django Girls Tutorial](https://tutorial.djangogirls.org/ja/)


## 動作環境
- python 3.6.5
- django 2.1.3

## Djangoって何？
python用のWebアプリケーションフレームワークです。
templateというDjango専用のモジュールが幾つも存在し、手軽にWebアプリケーションを作成できます。

[公式サイト](https://www.djangoproject.com/)

pythonのフレイムワークとして有名なのは
Djangoの他にtornadoや、flask、bottleなどがあります。
今回紹介するDjangoは主に中規模のWebアプリケーション作成などに用いられます。

## Django導入
先ほどにも述べた通り、pythonを既に導入しているという前提で説明していきます。
Pypi(チーズショップ)にDjangoモジュールがあります。
[Pypi-Django](https://pypi.org/project/Django/)
なのでまずは、以下のコマンドでDjangoモジュールをインストールしましょう。

`pip install Django==2.1.3`

## 初期ページ作成まで
Djangoを導入したのでまずはプロジェクトを作成しましよう。
以下のコマンドから作れます

`django-admin startproject mysite`

コマンド内の`mysite`の部分がプロジェクト名になります。
すると以下の画像のように自動でファイルが生成されます。

>mysite
┣db.sqlite3
┣manage.py
┗mysite/
　┣ `__pycache__/`
　　┗なんかたくさんある
　┣ `__init__.py`
　┣ `setting.py`
　┣ `urls.py`
　┗ `wsgi.py`




最後にターミナルでmanage.pyのディレクトリまで移動し、
~~無心で~~以下のコマンドを入力しましょう

`python manage.py runserver`

するとローカル環境でサーバーを立ち上げてくれて
以下の画像の通りに出力されます。
<img width="489" alt="スクリーンショット 2018-11-20 15.24.00.png" src="https://qiita-image-store.s3.amazonaws.com/0/294938/7674eb23-8e66-768a-a48e-b408519f5e1c.png">

このようになったらあとは、`Starting development server at ~`
の後に続くURLにアクセスしましょう。今回の場合は`http://127.0.0.1:8000/`ですね
<img width="1018" alt="スクリーンショット 2018-11-20 15.26.18.png" src="https://qiita-image-store.s3.amazonaws.com/0/294938/704edb60-b0f1-1a20-4134-03cfcf1bcd99.png">
このような画面が出てきたら、成功です！

どのようになっているかを説明すると、
プロジェクト名と同じ名前のディレクトリ内に`urls.py`というファイルがあり中身を開くとこう記述してあります。
<img width="711" alt="スクリーンショット 2018-12-02 15.38.53.png" src="https://qiita-image-store.s3.amazonaws.com/0/294938/60cd62cc-3251-719f-9253-402cc747b5f5.png">
~~言っておきますが、私はvimmerではありませんし、どちらの党にも属しておりません~~

そんなことはさておき20行目をみてみると、
`path('admin/',admin.site.urls),`と記述してあります。
先ほどの場合だと、`http://127.0.0.1:8000/`にアクセスしましたが、
要は`http://127.0.0.1:8000/+第一引数`にアクセスすると、第二引数を呼び出すよ！
という認識でいれば問題ないと思います。いわゆる`Router`ってやつですね！

以下の画像が`http://127.0.0.1:8000/admin/`にアクセスした時の画面です、
管理者用の画面がさらっとできてますが、アカウントを作成してないので、ログインはできませんよとだけいっておきます。

![スクリーンショット 2018-12-02 15.57.11.png](https://qiita-image-store.s3.amazonaws.com/0/294938/5d1c9658-e9c5-0c72-7b9f-1cc311ea3f53.png)

## 最後に
初めてアドベントカレンダーに参加し、初めてアウトプットをしたと思います。
自分が学んだことをアウトプットする機会があっていいなぁと思いました。
また、次回の機会がありましたら、この記事の続きで何か記事を書くかもしれません。

もし、なんか疑問点あったらコメントに書き込んでください。
<br>
４日目はひょーちゃんこと、加藤くん(@hyo_07 )がMask R-CNNのWindowsでの環境構築法について記事にしてくれるそうなので、そこに苦労している方がいらっしゃったら、必見ですね！

## 参考文献
[PythonのWebフレームワーク4種比較](https://qiita.com/Morio/items/8db3c9b3ba7f2c71ef27)
[はじめての Django アプリ作成、その1](https://docs.djangoproject.com/ja/2.1/intro/tutorial01/)
[PyPIの読み方](https://qiita.com/hamemi/items/2e5ff5bf4ade3f30ac02)
[Qiita で見出しアンカーへのページ内リンクを作る方法](https://qiita.com/nobuhikosekiya/items/c3a4830cbcc8fe6ec722)
[ディレクトリ構成図を書くときに便利な記号](https://qiita.com/paty-fakename/items/c82ed27b4070feeceff6)
[【HTML入門】スペース(空白)を表示させる3つの方法](https://qiita.com/Morio/items/6a2a790f288e7642ebbf)