DjangoでWebサイトを作ろう!③Djangoの仕組み解説と初期設定

2025-02-16 00:58

この記事は以下記事の続きとなります

DjangoでWebサイトを作ろう!②Djangoのインストール(2.5 VS Codeのインストールと基本機能解説も) | My Site

作業ステップ(自分用)

①Pythonのインストール

②Djangoのインストール

②.5(実施しなくても可だけどしたほうがいいと思う)VS Codeのインストールと基本的な使い方の解説

③(予定)Djangoの仕組み解説と初期設定 ← 今ここ

④(予定)管理用ユーザと記事投稿機能の実装方法

 

ここから本格的にDjangoでの開発をする準備をしていきます。

その前にDjangoの仕組みを説明していこうと思います。

個人の感想としては、説明を聞いただけではとても理解できないと思っています。

なので、詳細な解説+トラブルシューティングをするときに知っておいたほうがいい前提の知識箇所のみピックアップという形式で説明していこうと思います。

(徹底的に手順に従うだけならば、ここからの説明を無視して手順からでもできるはずです。その場合は頑張ってください!)

 

□Djangoについて

Djangoは MTV(Model-Template-View) という設計パターンを採用しています。

Model(モデル)

  • データベースのテーブルを表現するPythonのクラス

Template(テンプレート)

  • HTMLの表示を担当する部分。

View(ビュー)

  • ユーザーのリクエストを処理し、適切なレスポンスを返す。

 

この設計パターンを採用してくれていることで開発時に以下のメリット受けることができます。

・ディレクトリ構成の設計が不要(厳格に定められているため、場合によってはデメリット)

・データベースの専門的な知識なしで操作できる(Modelのみで定義を完結することができる。)

 

 

図にすると以下になります。

[ユーザー]
    │ (リクエスト: HTTPリクエスト)
    ▼
[URLルーティング]  ← (urls.py)
    │ (リクエストを適切なビューに振り分け)
    ▼
[View (ビュー)]  ← (views.py)
    │ (Modelからデータを取得し、Templateに渡す)
    ▼
[Model (モデル)]  ← (models.py)
    │ (データベースとやり取り)
    ▼
[データベース]
    │ (データを取得・保存)
    ▼
[View (ビュー)]
    │ (データを加工してTemplateに渡す)
    ▼
[Template (テンプレート)]  ← (templates/)
    │ (HTMLを生成)
    ▼
[ユーザー]  ← (レスポンス: HTMLを表示)

実際にこのサイトを見ている方を例にすると以下のようにやり取りが発生しています。

1.ユーザーがブラウザからリクエスト(例: https://horse-carnelian.com/articles/10/)を送信。

2.urls.py がリクエストされたURLに対応する views.py の関数を呼び出す。

3.views.py では、models.py を使ってデータベースから情報を取得。

4.取得したデータを templates/ 内のテンプレートに渡す。

5.テンプレートがHTMLを生成し、ユーザーにレスポンスを返す。

 

少し難しい内容となってしまいましたが、エラー発生時にこの流れを見ていただければ原因特定が速くなりますので頭の片隅にこんな処理があったなぐらいは残していただければと思います。

 

□この記事のゴール

→「python manage.py runserver」を実行してローカルホストのサーバにアクセスできるようにすること

 

□手順

①コマンドプロンプト上で作業するフォルダのディレクトリへ移動する。

(基本的にはどこでもいいですが、個人的にはデスクトップが作業しやすくておすすめです。)

 

②「django-admin startproject myproject(任意のプロジェクト名)」を実行する。

 

③「cd 任意のプロジェクト名」を実行し、実行先で「python manage.py runserver」を実行する。

 

④ブラウザを開いて、URLに「http://localhost:8000」を実行してロケットアイコンのページが表示されれば成功!

□この画面は何を意味しているの?

・DjangoがWebページを表示する準備ができていることを示してくれています!

ここからModel→Template→Viewに従って実装すればWebアプリを作ることができます!

 

次回はプロジェクト内でのアプリ開発初期設定を紹介します!