STATIC_ROOT、staticの設定について｜Django

ITC運営

4年前

（最終更新月：2022年1月）

✔このような方へ向けて書かれた記事となります

「DjangoでSTATICを設定する方法が知りたい！」

「そもそもSTATIC_ROOT、STATICFILES_DIRSとかってどんな役割？」

「初心者だし、実例もあると助かるんだけど、、、」

✔当記事を通じてお伝えすること

【Django】STATIC_ROOTの設定について
STATICFILES_DIRS、STATIC_URLとの違いは？
ローカル環境、本番環境別に実際のコード例を紹介

✔Webアプリの公開にはVPSがおすすめ

DjangoなどのWebアプリは、レンタルサーバーでの公開ができません。

自由度の高いVPSを使うのです。

VPS11社を比較し、おすすめをご紹介しています。

Webアプリの公開には、Ubuntuが搭載できるVPSを選びましょう。

Ubuntu環境が用意できたら、こちらのチュートリアルで公開方法を無料公開中。

筆者プロフィール

【現職】プロダクトマネージャー

【副業】ブログ（月間20万PV）/YouTube/Web・アプリ制作

「プログラミング × ライティング × 営業」の経験を活かし、30後半からのIT系職へシフト。現在はプロダクトマネージャーとして、さまざまな関係者の間に入り奮闘してます。当サイトでは、実際に手を動かせるWebアプリの開発を通じて、プログラミングはもちろん、IT職に必要な情報を提供していきます。

【当ブログで紹介しているサイト】

当サイトチュートリアルで作成したデモ版日報アプリ

Django × Reactで開発したツール系Webアプリ

✔人に見せても恥ずかしくないコードを書こう

「リーダブルコード」は、わかりやすく良いコードの定義を教えてくれる本です。

見るからにきれいなコードの書き方
コードの分割方法
変数や関数の命名規則

エンジニアのスタンダートとすべき基準を一から解説しています。

何回も読むのに値する本なので、ぜひ手にとって読んでみてください。

リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック

created by Rinker

STATIC_ROOTの設定について

STATIC_ROOTは、ローカル環境での設定は特に不要です。

STATIC_ROOTを設定する必要があるのは、CSSファイルを一箇所に集めたい時です。

これは、Apache等を搭載したWebサーバー上でCSSを読み込みたい時などが主な場面になります。

つまり、デプロイ時にのみ「STATIC_ROOT」を設定すればOKです。

例としては、

STATIC_ROOT = BASE_DIR / "static"

とした場合、下記のコマンド時に全てのCSSファイルが指定したフォルダ「static」に集まります。

$ python manage.py collectstatic

STATICFILES_DIRS、STATIC_URLとの違いは？

それでは、settings.pyにある「STATICFILES_DIRS」と「STATIC_URL」との違い、それぞれの役割は何なのでしょうか？

それぞれの役割を見ていきます。

STATICFILES_DIRS

STATICFILES_DIRSは、

ローカル環境で{% static %}タグを使った際に見に行く先のフォルダ
collectstaticを実行した際に見に行くフォルダ

です。

つまり、settings.py内で、

STATICFILES_DIRS = [
    BASE_DIR / 'static_local',
]

と指定した場合にstaticタグを使うと、「static_local」内に対象のファイルを探しに行くということになります。

ここでの設定が正しくされていないと、読み込みがされず、エラーとなります。

エラー解決の記事はこちら→☆【Django(エラー処理)】static cssファイルが読み込めない☆

STATIC_URL

STATIC_URLは、

ブラウザ上でアクセスするためのURLパス

を示しています。

つまり、STATICFILES_DIRSでどんなフォルダが指定されていようと、STATIC_URLが”/static/”の場合は、ブラウザから

localhost:8000/static/<cssファイル名>/

などとすることで、CSSファイルを見ることが可能です

ローカル環境、本番環境別に実際のコード例を紹介

実際にsettings.pyでは下記のように環境別にSTATICの設定をしています。

参考になれば幸いです。

【ローカル環境の場合】

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    BASE_DIR / 'static_local',
]

【本番環境の場合】

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    BASE_DIR / 'static_local',
]

STATIC_ROOT = "<実際に保存したいフォルダの絶対パス>/static" #「/var/www/html/static/」など。