Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 3】

ブログ作成についてまとめました。

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 3】

Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 2】

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 2】

Django REST Frameworkをバックエンドに、Next.js+MUIをフロントエンドにして、Markdown形式で記事を投稿するブログを作成しました。【Part 1】

Django REST Framework + Next.js (MUI) + Markdownでブログを作る【Part 1】

脱HerokuにともないRender.comにデプロイしてみました。

## はじめに
今に始まったことではありませんが、個人開発者の味方Herokuが無料で使えなくなったことで、同様の価格帯・スペックでテスト用・POC用に利用可能なRender.comに乗り換えた方も多いのではないでしょうか？私もついに重い腰を上げてRender.comを試してみたのでデプロイまでの方法まとめておきます。

### 注意（追記）
Render.comではSSH接続・ShellはFreeプランでは利用できません。そのため、本記事によってデプロイはできても利用ができません（申し訳ありません！！）。有償に切り替えるかデプロイ前にDjangoのSuperuserを作成しておく必要があります。前者については有償利用に切り替えるだけですが、後者については本記事に記載はないので予めご了承ください。。

## デプロイまでの流れ
デプロイは以下の手順で実施していきます。

1. アカウント作成
2. 必要ファイルの作成
3. リポジトリと接続
4. デプロイ

※ちなみに、[公式ドキュメント](https://render.com/docs/deploy-django)を見るとパッケージ管理ツールに`pip`ではなく`poetry`を使っていますが、`pip`でも問題なくデプロイできました。

## 1.アカウント作成
2023年6月時点では、GitHub・GitLab・Google・Emailでのアカウント作成ができるようです。今回私はGitLabのプロジェクトをデプロイを利用したいのでGitLabを選択しました。省略しますがメール認証・パスワード設定等をしてアカウント作成完了です。

## 2.必要ファイルの作成
Render.comにデプロイするには既存ファイルの変更、新ファイルの作成が必要になります。新ファイルは全てルートディレクトリに作成します。以下、+が新ファイル、▲が変更ファイルになりますが、下の順番で作成していくとスムーズにいくと思います。
* ▲project名/settings.py
* +requirements.txt
* +build.sh
* +render.yaml


### ▲project名/settings.py
まずはsettings.pyの修正をしていきましょう。

<script src="https://gitlab.com/-/snippets/2565110.js"></script>

省略されているコードが複数箇所ありますが、変更部分は「#(追加)」とコメントアウトしている部分になります。
DBの設定部分についてはHerokuでも同様なので、Herokuから移行する場合には追記しなくでも大丈夫だと思います。
また、`WhiteNoise`はDjango REST Frameworkでは不要かもしれませんが（未検証）、公式ドキュメント通り一応設定してみています。

### +requirements.txt
次に、ローカルでインストールしたパッケージを本番環境でも利用するために、パッケージをリスト化した`requirements.txt`ファイルを作成します。

<script src="https://gitlab.com/-/snippets/2565111.js"></script>
本当はもっと多くのパッケージをインストールしていますが、紛らわしいので省略してしまっています。ただし、`settings.py`ファイル修正時に追加したパッケージ（`whitenoise`, `psycopg`, `gunicorn`等）については必ずインストールが必要です。
`requirements.txt`ファイルは以下のコマンドを実行することで作成可能です。

```
pip freeze > requirements.txt
```

### +build.sh
次に`+build.sh`ファイルを作成します。デプロイ時に実行されるコマンドを記述したファイルです。

<script src="https://gitlab.com/-/snippets/2565107.js"></script>

通常ローカルでも利用するコマンドなので説明は省略しますが、ここでは上で作成した`requirements.txt`をインストールしているのがポイントです。

### render.yaml
最後にRender.comにおける環境を設定する`render.yaml`ファイルを作成しましょう。

<script src="https://gitlab.com/-/snippets/2565109.js"></script>

ここまで上記で設定してきた内容を反映していることが分かりますね。
Herokuの場合はUSとEuropeから選択できますが、Render.comではSingaporeも選択肢にあるのが大きな違いですね。
また、上のように`envVars`に値を入力すると、デプロイ時に環境変数を手動でセットしなくても自動で設定してくれるので便利です。

## 3.リポジトリと接続
必要なファイルが作成できたら[ダッシュボード画面](https://dashboard.render.com/)にいき、下の画像のようにヘッダーにある<strong><i>"New"</i></strong>から<strong><i>"Web Service"</i></strong>を選択します。<strong><i>"Configure account"</i></strong>（画面右側中央部）からGitLabと接続しましょう。GitLabとの接続が完了したら画面中央部に接続可能なリポジトリが表示されるので、該当のプロジェクトを<strong><i>「Connect』</i></strong>ボタンをクリックして接続させます。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/gitlab-render-django1_f53brc">

## 4.デプロイ
上で<strong><i>「Connect」</i></strong>ボタンをクリックすると下のような画面に遷移します。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/gitlab-render-django2_stnfgj">

ここから<strong><i>"Name"</i></strong>に`render.yaml`ファイルで入力したプロジェクト名を転記、他の項目も必要であれば変更を加えていき（ほぼ変更不要だと思います）、ページ最下部の<strong><i>「Create Web Service」</i></strong>を押すと、下のようにデプロイが走ります（画像では途中でキャンセルしています※なお、赤い網掛け部分にはGitLabのリポジトリのパスが表示されています）。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/gitlab-render-django3_pwfsco">

下の画像のように、左ナビゲーションの<strong><i>"Events"</i></strong>から青緑色の雲マークが表示されればデプロイ完了です。あとはDjangoのSuperuserを作成して、、という流れですが、冒頭記載の通りFreeプランではShellが使えないので、よろしければこちらの[記事](https://qiita.com/kkk777/items/91a00e431d3e1d72d51e)を参考にされると良いかもしれません。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/gitlab-render-django4_ur4s9w">

## まとめ・参考
### 参考
* [Renderにデプロイ（Django）](https://qiita.com/kkk777/items/91a00e431d3e1d72d51e#django%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0%E3%82%B3%E3%83%9E%E3%83%B3%E3%83%89%E3%82%92%E4%BD%9C%E3%82%8B)

GitLabとRender.comを連携させてDjangoプロジェクトをデプロイしてみた

Djangoでの開発時よく使用されるコマンドについて調べました。

## はじめに
Djangoで必ず使用するファイルと言えば？、、、`manage.py`ですよね。これが使えないと話にならないと思います。ではこのファイルを使ったコマンドはいくつ言えますか？、、、`makemigrations`, `migrate`, `runserver`もセットで覚えると思いますが、私だけでしょうか、他は使わないからすぐ忘れてしまうんですよ。山手線ゲームやったら確実に4・5人目で切れますね。そこで今回はコマンドおよびコマンドラインユーティリティの種類・使い方についてまとめました。

## コマンドラインユーティリティ
コマンドラインユーティリティはDjangoプロジェクトを実行するために必要なものです。以下の通り3種類あります。いずれも同じ役割を果たしますが、一番はじめにプロジェクトを作る際には`django-admin`を使用します。
<script src="https://gitlab.com/-/snippets/2566313.js"></script>
* <strong>`django-admin`</strong>：
    * プロジェクト作成時に使用します。
* <strong>`python3 manage.py`</strong>：
    * 最も高頻度で使用されます。
* <strong>`python3 -m django`</strong>：
    * `manage.py`に共に使用することができます。

## コマンド
ここから上記のコマンドユーティリティを使用した頻出コマンドをまとめます。
<script src="https://gitlab.com/-/snippets/2566315.js"></script>
* <strong>`$ django-admin startproject`</strong>：
    * Djangoプロジェクトを作成するためのコマンド。まさにDjangoの根幹（1）。
* <strong>`$ django-admin startapp`</strong>：
    * Djangoアプリケーションを作成するするためのコマンド。まさにDjangoの根幹（2）。
* <strong>`$ python3 manage.py collectstatic`</strong>：
    * HTMLファイル、CSSファイル、画像ファイル等のstaticファイル（静的ファイル / assets）をまとめるためのコマンド。開発環境ではDjangoが自動で管理する一方、本番環境ではこのコマンドでstaticファイルを一つのディレクトリに集めておく。`settings.py`では、STATIC_ROOT, STATIC_URL, STATICFILES_DIRS, STATICFILES_STORAGE等を別途設定する。
* <strong>`$ python3 manage.py changepassword [username]`</strong>：
    * 任意の[username]のパスワードを変更可能。
* <strong>`$ python3 manage.py createsuperuser`</strong>：
    * Djangoの管理サイトにログインし使用するための管理者ユーザーを作成するためのコマンド。ユーザー名、メールアドレス、パスワードを指定する。
* <strong>`$ python3 manage.py dumpdata`</strong>：
    * データベースの内容をバックアップ等の目的でエクスポートするためのコマンド。JSON形式、XML形式等のフォーマットを指定しアプリケーション単位、テーブル単位でエクスポート可能。
* <strong>`$ python3 manage.py help ([command name])`</strong>：
    * 困ったときはこれ。helpと入れるだけで利用可能なコマンドを出力可能。さらに、[command name]を入力すると、そのコマンドのオプション含めた使い方を教えてくれる。
* <strong>`$ python3 manage.py loaddata`</strong>：
    * dumpしたファイルをデータベースにインポートするためのコマンド。例えばJSON形式のファイルをインポートする際には、`loaddata`以降に`sample.json`という形式で指定可能。
* <strong>`$ python3 manage.py makemigrations`</strong>：
    * `models.py`で定義した内容をデータベースに反映させるための、マイグレーションファイルを作成するためのコマンド。
* <strong>`$ python3 manage.py migrate`</strong>：
    * データベースに対して、`makemigrations`で作成したマイグレーションファイルを適用するためのコマンド。
* <strong>`$ python3 manage.py runserver`</strong>：
    * 開発環境用のローカルサーバーを起動するためのコマンド。
* <strong>`$ python3 manage.py showmigrations`</strong>：
    * 作成したマイグレーションファイル一覧を表示するためのコマンド。
* <strong>`$ python3 manage.py test`</strong>：
    * 自動でテストを実行するためのコマンド。テスト内容は`startapp`実行時に自動で作成される`test.py`内に記述する。
* <strong>`$ python3 manage.py testserver`</strong>：
    * テスト用サーバーを起動するためのコマンド。

## helpを使ってできること
このようにコマンドはたーくさんあるんですが、他にもまだまだたくさんあります。実際に`help`を使ってみると、現在インストールされているライブラリに応じて、カテゴリごとに利用可能なコマンドが確認できるので見てみましょう。
<script src="https://gitlab.com/-/snippets/2566316.js"></script>
現在"django-cloudinary-storage"というパッケージが入っているので、`[cloudinary_storage]`で利用可能なコマンドが表示されていることが分かりますね。
では次に、helpの後にコマンドを追加してみます。上でも記載しましたが、`help [command name]`とすることで、各コマンドで利用可能なオプションを簡単に説明してくれます。ここでは`createsuperuser`を入力してみます。
<script src="https://gitlab.com/-/snippets/2566348.js"></script>
すると8行目以降に利用可能なオプションが表示されます。

## まとめ・参考
とりあえず"help"を使おうということだけ言っておきます。

Djangoでよく使用するコマンド

DRF環境構築時の基本的なディレクトリ構成について詳細解説しました。

## はじめに
[Django REST Framework（以降、DRF）の環境構築](/blogs/drf-setup)にてDjangoプロジェクトを作成しましたが、いきなり膨大な量のディレクトリ・ファイルができました。全ファイルを知っておかないといけないことはありませんが、「よく分からんけど動いてはる」のは気持ち悪いじゃないですか。ということでデフォルトの構成についてまとめてみました。

## ディレクトリ構成
こんな感じになっているはずです。では、「1行解説」はじめます。
<br/>
<script src="https://gitlab.com/-/snippets/2565795.js"></script>

### ルートディレクトリおよび全体に影響するディレクトリやファイル
DjangoプロジェクトやDjangoアプリケーション以外のものをここではまとめています。
* <strong>`drf_sample/`</strong>(l.1)：
    * ルートディレクトリです。環境構築時にプロジェクト・アプリケーションを格納する箱として任意の名前を付けて用意します。
* <strong>`drf_virtual/`</strong>(l.2)：
    * 当該API専用に使用する仮想環境です。`drf_sample`作成時にデフォルトで生成されるものではありませんが、ルートディレクトリ内に作成することもできます。
* <strong>`manage.py`</strong>(l.27)：
    * Djangoプロジェクトにおいて、ローカルサーバーの起動、マイグレーションファイルの作成等、様々なコマンドを用意しているファイルです。
* <strong>`db.sqlite3`</strong>(l.28)：
    * アプリケーションに組み込まれる形で利用される簡易的なデータベースです。Djangoではデフォルトで利用可能で、設定しない限りはこのデータベースに情報が格納されます。

### Djangoプロジェクト
* <strong>`sample_project/`</strong>(l.16)：
    * `$ django-admin startproject`コマンドでDjangoプロジェクトディレクトリおよびその傘下のファイルを作成できます。自動で生成されるファイルは以下の通りです。
* <strong>`__init__.py`</strong>(l.17)：
    * このディレクトリ（`sample_project/`）がPythonのパッケージであることをPythonに認識させるためのファイルです。空のファイルで使用しません。
* <strong>`__pycache__/`</strong>(l.18)：
    * Pythonファイル実行時にコンパイルされたこのディレクトリ内のモジュールが、それぞれ`ファイル名.cpython-39.pyc`という形式でこのディレクトリ内に生成されていきます。プログラムが変更されると書き換えられるもので、文字通りキャッシュなので（消しても問題ありませんが）残しておくと実行が速くなります。
* <strong>`asgi.py`</strong>(l.23)：
    * asgiとはAsynchronous Server Gateway Interfaceの略で、Web socket等のプロトコルをサポートし、非同期通信ができるようになります。そのエンドポイントとして使用されるファイルです。
* <strong>`settings.py`</strong>(l.24)：
    * Djangoプロジェクト全体を設定するファイルです。データベース設定、認証系の設定等が可能です。
* <strong>`urls.py`</strong>(l.25)：
    * HTTPリクエストに対して、Djangoアプリケーション内のどのViewを表示するかルーティングするためのファイルです。
* <strong>`wsgi.py`</strong>(l.26)：
    * wsgiとはWeb Server Gateway Interfaceの略で、アプリケーションがWebサーバと通信するための標準のインタフェースです。そのエンドポイントとして使用されるファイルです。

### Djangoアプリケーション
* <strong>`sample_app/`</strong>(l.7)：
    * `$ django-admin startapp`コマンドでDjangoアプリケーションディレクトリおよびそれにぶら下がるファイルを作成できます。アプリケーションではデータベース定義、Viewの作成等ができます。
* <strong>`migrations/`</strong>(l.8)：
    * `$ python3 manage.py makemigrations`を実行し生成されたマイグレーションファイルが保管されるディレクトリです。
* <strong>`__init__.py`</strong>(l.10)：
    * このディレクトリ（`sample_app/`）がPythonのパッケージであることをPythonに認識させるためのファイルです。空のファイルです。
* <strong>`admin.py`</strong>(l.11)：
    * adminサイトを管理するためのファイルです。実際にデータを入力するために、`models.py`で作成したクラスをadminサイトに表示することができます。
* <strong>`apps.py`</strong>(l.12)：
    * 作成したDjangoアプリケーションの場所をDjangoプロジェクトに認識させるために設定ファイルです。※通常、`startapp`時に自動で生成されるため設定は不要です。
* <strong>`models.py`</strong>(l.13)：
    * データベースを定義するためのファイルです。データベースフィールドをまとめたモデルを作成することで、データベースにどのような情報をどのような形式で書き込むことができるか定義します。
* <strong>`tests.py`</strong>(l.14)：
    * Djangoアプリケーションにおいて、テストを実行する際にコードを記述するファイルです。
* <strong>`views.py`</strong>(l.15)：
    * HTTPリクエストに対し、表示する情報を記述するためのファイルです。

## まとめ・参考
ここまで、前記事で環境構築時に自動（+一部手動）で生成されたディレクトリおよびファイルについて、それぞれの役割を解説してきました。DRFの場合、この他にもSerializerというものが必要になるのですが、それは次の記事でまとめます。

Django REST Frameworkのディレクトリ構成

Django REST Frameworkを始める際の環境構築についてまとめました。

## はじめに
Web開発をする際のフレームワークは数多ありますが、今回はPythonのWebフレームワークであるDjangoをバックエンドに使用した方法についてまとめました。なお、本記事はDjango初学者向けとなります。

## 開発環境
* macOS 10.15 Catalina
* Python 3.9.6
* Django 4.0.2
* Django REST Framework 3.13.1
* Visual Studio Code

## 環境構築
このタイミングで使用するツールはターミナルだけで、作業自体は大きく4ステップで完了するので難しくはないと思いますが、ここからは「1行解説」やっていきます。
### ディレクトリ作成（１／４）
<script src="https://gitlab.com/-/snippets/2565791.js"></script>
1. (l.1)まずはターミナルを開いてデスクトップに移動します。今回はデスクトップにプロジェクトを作成していきます。
2. (l.2)プロジェクト全体を入れる箱として、`drf_sample`を作成します。名前は何でも大丈夫です。
3. (l.3)作成した`drf_sample`に移動します。続いて仮想環境を作成しましょう。

### 仮想環境作成（２／４）
<script src="https://gitlab.com/-/snippets/2565792.js"></script>
1. (l.1~2)仮想環境を作成する前にPythonのバージョンを確認します。2行目の通りPython 3.9.6と出てきたので、パスが通っていることが確認できましたね。※Pythonが使える環境が最低限整っていることを意味します。
2. (l.3)それでは仮想環境を作成します。今回はPythonに標準で備わっている`virtualenv`を使用して、`drf_virtual`という名前の仮想環境を作成します。仮想環境の名前は何でも大丈夫です。
3. (l.4~5)作成した仮想環境に切り替えます。5行目の通り先頭に`(drf_virtual)`が表示されていたら、仮想環境に切り替わっている状態となります。今後API作成に必要なライブラリ・パッケージはこの仮想環境内にインストールしていきます。

### ライブラリ・パッケージのインストール（３／４）
<script src="https://gitlab.com/-/snippets/2565793.js"></script>
1. (l.1~5)`Django`, `django-cors-headers`, `djangorestframework`, `djangorestframework-simplejwt`, `djoser`をそれぞれ仮想環境にインストールしていきます。ここで`===x.x.x`と、バージョン指定をしてインストールしていますが、バージョン指定しなくてもインストールは可能です。ただし、互換性を考慮しないと正しいコードを書いても実行されない可能性があるので注意してください。
※互換性については、各ライブラリ・パッケージの概要、インストール・使用方法が併記された[Python Package Index（PyPI）](https://pypi.org/)で確認してみてください。
2. (l.6)インストールが完了したら`pip freeze`とすることで、`drf_virtual`内でインストール済みのライブラリ・パッケージを確認することができます。なお、`pip freeze > requirements.txt`とすると、インストール済みのライブラリ・パッケージが書き出されたファイルがルートディレクトリ直下に生成されます。

なお、以下はDjangoを除く各ライブラリ・パッケージについて一言解説です。
* [django-cors-headers](https://pypi.org/project/django-cors-headers/)：フロントエンドとのWebAPI連携を可能にするためのパッケージ。
* [djangorestframework](https://pypi.org/project/djangorestframework/)：今回の開発の肝となるライブラリです。Djangoを利用したWebAPIの開発ができる。DRFとも略される。
* [djangorestframework-simplejwt](https://pypi.org/project/djangorestframework-simplejwt/)：DRFでJWT認証を可能にするプラグインのパッケージ。
* [djoser](https://pypi.org/project/djoser/)：DRFにおいて認証周りの機能をサポートするライブラリ。


### Djangoプロジェクト作成（４／４）
<script src="https://gitlab.com/-/snippets/2565794.js"></script>
1. (l.1)最後のステップになります。まずは`sample_project`という名前のDjangoプロジェクトを作成します。プロジェクトとは今回のAPIにおける大枠となる設定等をまとめたものです。
2. (l.2)続いて`sample_app`という名前のDjangoアプリケーションを作成します。ここでいうアプリケーションとは、データベース定義や実際のAPI作成等をするディレクトリです。
3. (l.3)プロジェクトとアプリケーションを作成したので、ベースとなる構成は完成しました。必要なファイルも勝手に生成されるので楽ですね。それでは、一旦ローカルサーバーを立ち上げてみましょう。
4. (l.4~7)ローカルサーバーを立ち上げると、4行目〜7行目の通り情報が出力されます。`http://127.0.0.1:8000/`がローカルサーバーのURLです。下のような画面がブラウザで表示されれば、OKです。`CONTROL-C`でサーバーを切ることができます。ちなみに、画面上ではバージョン情報と時間はズレまくっていますが特に影響ないので放置しておきます。
<img src="https://res.cloudinary.com/hvz4uox2m/image/upload/v1/media/img/drf-setup1_cbvgnx" />

* また、現時点で、`drf_sample`のディレクトリは以下の通りになっているはずです。全体の構成および各ディレクトリ・ファイルの役割については[Django REST Frameworkのディレクトリ構成](/articles/drf-directory)の記事で説明しています。

<script src="https://gitlab.com/-/snippets/2565795.js"></script>

## まとめ・参考
お気づきだと思いますが、Pythonが使える環境であれば、DRFの環境設定は難なくできてしまいます。次の記事から実際にコードを書いていくフェーズに入ります。

### 参考
* [PyPi](https://pypi.org/)