Djangoでのブログの始め方２

今回は前回に引き続きDjangoでのブログの始め方について記事を書きたいと思います。今回はDjangoプロジェクトのディレクトリ構造について説明したいと思います。

1 実際のディレクトリ構造
2 主要なディレクトリ
3 chike_tech_blog(外側)
4 chike_tech_blog(内側)
5 アプリケーションたち(blog,posts)
6 migrations
7 templates
8 static
9 media
10 node_modules
11 utils
12 終わりに

実際のディレクトリ構造
主要なディレクトリ
chike_tech_blog(外側)
chike_tech_blog(内側)
アプリケーションたち(blog,posts)
migrations
templates
static
media
node_modules
utils
終わりに

実際のディレクトリ構造

以下が実際のディレクトリ構造になります。長いので所々は省略してます。（__pycache__やインストールされてるライブラリなど）これから主要なディレクトリについて説明していきます。ファイルまで書くとかなり長くなりそうなのでファイルは別記事で書く予定です。

├─chike_tech_blog
│ │ db.sqlite3
│ │ manage.py
│ │ package-lock.json
│ │ package.json
│ │ requirements.txt
│ │
│ ├─blog
│ │ │ admin.py
│ │ │ apps.py
│ │ │ models.py
│ │ │ tests.py
│ │ │ urls.py
│ │ │ views.py
│ │ │ init.py
│ │ │
│ │ ├─migrations
│ │ │
│ │ ├─static
│ │ │ └─blog
│ │ │ ├─css
│ │ │ ├─images
│ │ │ └─js
│ │ │ script.js
│ │ │
│ │ ├─templates
│ │ │ └─blog
│ │ │ index.html
│ │ │ profile.html
│ │ │
│ │ └─pycache
│ │
│ ├─chike_tech_blog
│ │ │ asgi.py
│ │ │ settings.py
│ │ │ urls.py
│ │ │ wsgi.py
│ │ │ init.py
│ │ │
│ │ ├─templates
│ │ └─pycache
│ │
│ ├─media
│ │ └─uploads
│ │
│ ├─node_modules
│ │ │ .package-lock.json
│ │ │
│ │
│ ├─posts
│ │ │ admin.py
│ │ │ apps.py
│ │ │ models.py
│ │ │ tests.py
│ │ │ urls.py
│ │ │ views.py
│ │ │ init.py
│ │ │
│ │ ├─migrations
│ │ │
│ │ ├─templates
│ │ │ └─posts
│ │ │ post_detail.html
│ │ │
│ │ └─pycache
│ │
│ ├─templates
│ │ base.html
│ │
│ └─utils
│ shiki_render.mjs

主要なディレクトリ

今回紹介していくのは以下に記載されているものです。もしほしい情報がないよ！といった方はコメントしていただくか、ブラウザバックお願いします。

chike_tech_blog(外側)
chike_tech_blog(内側)
他アプリケーションたち(blog,posts)
migrations
templates
static
media
node_modules
utils

chike_tech_blog(外側)

chike_tech_blogはディレクトリ構造を見ると２つあると思います。ディレクトリ構造の上にあるディレクトリを外側、下にあるディレクトリを内側としてこのブログでは記載していきます。このディレクトリはDjangoプロジェクトのすべてを詰める箱です。このディレクトリの中にたくさんのコードを書いていくことになります。Djangoをインストールした後に以下コマンドを実行すると、このディレクトリと内側のchike_tech_blogが作られます。

chike-tech-blog-projectを作りたいなら

django-admin startproject chike-tech-blog-project

汎用的なやつ

django-admin startproject [プロジェクト名]

chike_tech_blog(内側)

このディレクトリは先ほどのコマンドで作られた内側のchike_tech_blogです。このディレクトリには設定ファイルであったり、Webサーバとの橋渡しを行うファイルだったりと重要なファイルが含まれています。その為、何か作業ミスをした際に面倒くさいからこのファイル消しちゃえとかこのディレクトリごと消しちゃえなんてことはしてはいけません。（自分は以前また作ればいいやという軽い気持ちで消して後悔したことがあります(´;ω;｀)）

アプリケーションたち(blog,posts)

次に紹介するのはアプリケーションたちです。Djangoでは機能ごとにアプリという単位で分けてディレクトリを作成します。今回でいうとblogがブログの基盤の部分ホームページだったり、マイページだったりを含んでいます。そしてpostsがブログに書いていく記事の役割をしています。ほかにもよく見かけるやつだとログイン機能のあるWebサイトでユーザ情報を扱っているusersというアプリがありますね。このようなアプリケーションは以下のコマンドを実行して作成します。

blogを作りたいなら

python manage.py startapp blog

汎用的なやつ

python manage.py startapp [アプリ名]

migrations

このディレクトリはマイグレーションズと読みます。このディレクトリはデータベースのスキーマ（構造）の変更履歴を管理するディレクトリです。別記事で書く予定ですが、models.pyというpythonファイルにデータベースのスキーマを設定していきます。その変更履歴がどんどんmigrationsディレクトリに追加されていきます。models.pyからmigrationsディレクトリにデータベースのスキーマを記録してデータベースがmigrationsディレクトリを読み取って反映していきます。以下のようなコマンドを実行していきます。

models.pyからmigrationsディレクトリにデータベースのスキーマを記録

python manage.py makemigrations [アプリ名]

migrationsディレクトリを読み取ってデータベースに反映させる

python manage.py migrate

templates

このディレクトリにはHTMLファイルが入ります。HTMLファイルとはブログの画面を作ってくれるファイルです。このディレクトリは少し特殊で、自分で作成をしなくてはなりません。templatesを作成してくれる専用のコマンドはないのでテキストエディタやエクスプローラーを使ってtemplatesディレクトリを作成するか以下コマンドを使用してディレクトリを作成しましょう。

templatesという名前のディレクトリを作るコマンド

mkdir templates

また、templatesディレクトリの構造としてはtemplates/[アプリ名]/〇〇.htmlというように、templatesディレクトリの中にアプリ名のディレクトリを作成してその中にHTMLファイルを入れる必要があります。

static

このディレクトリは画像やCSS、JavaScriptのファイルを入れるディレクトリになります。こちらも先ほどのtemplatesと同じようにstaticを作る専用のコマンドが無いのでテキストエディタやエクスプローラーを使ってstaticディレクトリを作成するか以下コマンドを使用してディレクトリを作成しましょう。

staticという名前のディレクトリを作るコマンド

mkdir static

また、templatesと似たような感じでこちらも構造としてはstatic/[アプリ名]/css/〇〇.cssのように、staticディレクトリの中にアプリ名のディレクトリその中にcssもしくはjs(JavaScriptを入れるディレクトリ)もしくはimage(画像を入れるディレクトリ)を作成してその中に各ファイルを入れる必要があります。

media

このディレクトリも画像を入れるディレクトリになります。先ほどのstatic/[アプリ名]/imageと何が違うかというと動的に画像をアップロードするかしないかです。先ほどのディレクトリには元から使う画像が格納されます。ホームページやマイページなど基本的には変わらないもので使う画像は先ほどのディレクトリに入れます。mediaディレクトリには後からアップロードする画像を入れます。新しく記事を書く際にその記事内で使う画像などです。そのような使い分けをしていきます。

node_modules

このディレクトリにはJavaScriptで使用するライブラリなどが格納されています。その為、JavaScriptのライブラリをインストールしない場合はこのディレクトリは作成されません。今回でいうと、shikiというコードシンタックスハイライトを行うライブラリをインストールしているので作成されています。

utils

最後にutilsディレクトリです。このディレクトリはまあ正直作らなくてもいいのですが、システム内で繰り返し使われる汎用的な処理が記載されているファイルが格納されます。というかそういうマナー的なやつです。今回でいうと、先ほどちょこっと出てきたshikiを使用した処理が繰り返し使われるので、その処理が記載されたファイルが格納されています。

終わりに

ここまで見てくれた皆様ありがとうございました。今回はディレクトリ構造ということでかなり長めの記事になってしまいました。次はディレクトリの中に格納されているファイルの説明を書いていきたいなと考えています。今後ともよろしくお願いいたします。