Djangoのモデル設計とfixtureでブログのデータベースを作る【AIと一緒に作るDjangoブログ入門 #4】

# こう書くと...
class Post(models.Model):
    title = models.CharField(max_length=200)

# MySQLにこんなテーブルが作られる
# CREATE TABLE blog_post (
#     id INT AUTO_INCREMENT PRIMARY KEY,
#     title VARCHAR(200)
# );

from django.db import models
from django.urls import reverse


class Category(models.Model):
    """記事のカテゴリ。"""

    name = models.CharField(max_length=100, verbose_name='カテゴリ名')
    # URLに使うため半角英数字・ハイフンのみ。uniqueで重複を防ぐ
    slug = models.SlugField(unique=True, verbose_name='スラッグ')

    class Meta:
        verbose_name = 'カテゴリ'
        verbose_name_plural = 'カテゴリ'

    def __str__(self):
        return self.name


class Post(models.Model):
    """ブログ記事。"""

    title = models.CharField(max_length=200, verbose_name='タイトル')
    # URL に使う識別子。例: /posts/django-tutorial/
    # SEOと可読性のため記事ごとに固有の英数字を必ず設定する
    slug = models.SlugField(max_length=200, unique=True, verbose_name='URL用スラッグ')
    # 一覧ページ用の短い説明。省略可能
    summary = models.CharField(max_length=300, verbose_name='要約', blank=True)
    # 本文（Markdown形式）。管理画面では後の章で Toast UI Editor に置き換える
    body = models.TextField(verbose_name='本文')
    # カテゴリを削除しても記事は残す（SET_NULL）
    category = models.ForeignKey(
        Category,
        on_delete=models.SET_NULL,
        null=True,
        blank=True,
        verbose_name='カテゴリ',
    )
    is_published = models.BooleanField(default=False, verbose_name='公開')
    # 未公開の場合はNullを許容する
    published_at = models.DateTimeField(null=True, blank=True, verbose_name='公開日時')
    # 記事詳細ページを開くたびに1加算する
    view_count = models.PositiveIntegerField(default=0, verbose_name='閲覧数')
    created_at = models.DateTimeField(auto_now_add=True, verbose_name='作成日時')
    updated_at = models.DateTimeField(auto_now=True, verbose_name='更新日時')

    class Meta:
        verbose_name = '記事'
        verbose_name_plural = '記事'
        # 公開日時の新しい順に並べる。
        # 同じ published_at の記事が複数あっても順序がブレないよう、第2キーで id 降順を必ず併用する
        ordering = ['-published_at', '-id']

    def __str__(self):
        return self.title

    def get_absolute_url(self):
        """この記事の詳細ページURLを返す。

        sitemap.xml や管理画面の「サイトを表示」リンクで使われる。
        """
        return reverse('blog:detail', kwargs={'slug': self.slug})


class DisplaySlot(models.Model):
    """トップページの表示スロット管理。

    どのスロットにどの記事を置くかを管理する。
    スロットの種類や数をコードを変えずに管理画面から追加・変更できる。
    """

    SLOT_FEATURED = 'featured'
    SLOT_PICKUP = 'pickup'

    SLOT_CHOICES = [
        (SLOT_FEATURED, '特集バナー'),
        (SLOT_PICKUP, 'ピックアップ'),
    ]

    slot_type = models.CharField(max_length=50, choices=SLOT_CHOICES, verbose_name='スロット')
    post = models.ForeignKey(Post, on_delete=models.CASCADE, verbose_name='記事')
    # 同じスロット内での並び順。数字が小さいほど先に表示する
    order = models.IntegerField(default=0, verbose_name='表示順')

    class Meta:
        verbose_name = '表示スロット'
        verbose_name_plural = '表示スロット'
        ordering = ['slot_type', 'order']

    def __str__(self):
        return f'{self.get_slot_type_display()} / {self.post.title}'

# マイグレーションファイルを生成する（設計図を作る）
docker compose run --rm web python manage.py makemigrations

# マイグレーションを実行する（実際にテーブルを作る）
docker compose run --rm web python manage.py migrate

from django.contrib import admin

from .models import Category, DisplaySlot, Post


@admin.register(Category)
class CategoryAdmin(admin.ModelAdmin):
    """カテゴリの管理画面設定。"""

    list_display = ['name', 'slug']
    # nameを入力すると自動でslugを生成する
    prepopulated_fields = {'slug': ('name',)}


@admin.register(Post)
class PostAdmin(admin.ModelAdmin):
    """記事の管理画面設定。"""

    list_display = ['title', 'category', 'is_published', 'view_count', 'published_at']
    list_filter = ['is_published', 'category']
    # 一覧画面から直接クリックで切り替えられる
    list_editable = ['is_published']
    search_fields = ['title', 'body']
    # titleを入力すると自動でslugを生成する
    prepopulated_fields = {'slug': ('title',)}


@admin.register(DisplaySlot)
class DisplaySlotAdmin(admin.ModelAdmin):
    """表示スロットの管理画面設定。"""

    list_display = ['slot_type', 'post', 'order']
    list_editable = ['order']
    list_filter = ['slot_type']
    ordering = ['slot_type', 'order']

docker compose run --rm -it web python manage.py createsuperuser

mkdir -p ~/myblog/blog/fixtures

[
  { "model": "blog.category", "pk": 1, "fields": { "name": "Django", "slug": "django" } },
  { "model": "blog.category", "pk": 2, "fields": { "name": "Docker", "slug": "docker" } },
  { "model": "blog.category", "pk": 3, "fields": { "name": "Python", "slug": "python" } },

  {
    "model": "blog.post",
    "pk": 1,
    "fields": {
      "title": "AIと一緒に作るDjangoブログ入門",
      "slug": "django-blog-intro",
      "summary": "DockerとDjangoを使ってブログサイトをゼロから作る方法を解説します。",
      "body": "## はじめに\n\nこの記事では **Docker** と **Django** を使ってブログサイトをゼロから作ります。",
      "category": 1,
      "is_published": true,
      "view_count": 0,
      "published_at": "2026-05-21T00:00:00Z",
      "created_at": "2026-05-21T00:00:00Z",
      "updated_at": "2026-05-21T00:00:00Z"
    }
  },
  {
    "model": "blog.post",
    "pk": 2,
    "fields": {
      "title": "Docker入門：なぜDockerを使うのか",
      "slug": "docker-intro",
      "summary": "MacにPythonをインストールしなくていい理由と、Dockerの仕組みを解説します。",
      "body": "Dockerは仮想の箱を作るツールです。Pythonが入った箱を用意するだけで動かせます。",
      "category": 2,
      "is_published": true,
      "view_count": 0,
      "published_at": "2026-05-20T00:00:00Z",
      "created_at": "2026-05-20T00:00:00Z",
      "updated_at": "2026-05-20T00:00:00Z"
    }
  },
  {
    "model": "blog.post",
    "pk": 3,
    "fields": {
      "title": "Bootstrap5でデザインを整える",
      "slug": "bootstrap5-design",
      "summary": "CSSを書かなくてもBootstrap5を使えば綺麗なデザインが作れます。",
      "body": "Bootstrap5はCSSのフレームワークです。クラスをHTMLに書くだけでレスポンシブなレイアウトが作れます。",
      "category": 1,
      "is_published": true,
      "view_count": 0,
      "published_at": "2026-05-19T00:00:00Z",
      "created_at": "2026-05-19T00:00:00Z",
      "updated_at": "2026-05-19T00:00:00Z"
    }
  },
  {
    "model": "blog.post",
    "pk": 4,
    "fields": {
      "title": "settings.pyの設定を理解する",
      "slug": "settings-py-guide",
      "summary": "DEBUG・ALLOWED_HOSTS・DATABASESなど重要な設定項目を解説します。",
      "body": "DjangoのDEBUG・ALLOWED_HOSTS・DATABASESなど、settings.pyの重要な設定項目を解説します。",
      "category": 1,
      "is_published": true,
      "view_count": 0,
      "published_at": "2026-05-18T00:00:00Z",
      "created_at": "2026-05-18T00:00:00Z",
      "updated_at": "2026-05-18T00:00:00Z"
    }
  },
  {
    "model": "blog.post",
    "pk": 5,
    "fields": {
      "title": "環境変数（.env）とは何か",
      "slug": "env-file-guide",
      "summary": "パスワードをコードに直接書いてはいけない理由を解説します。",
      "body": "パスワードをコードに直接書くとGitHubで全世界に公開されてしまいます。.envに書くのが安全です。",
      "category": 3,
      "is_published": false,
      "view_count": 0,
      "published_at": null,
      "created_at": "2026-05-17T00:00:00Z",
      "updated_at": "2026-05-17T00:00:00Z"
    }
  },

  { "model": "blog.displayslot", "pk": 1, "fields": { "slot_type": "featured", "post": 1, "order": 0 } },
  { "model": "blog.displayslot", "pk": 2, "fields": { "slot_type": "pickup",   "post": 2, "order": 0 } },
  { "model": "blog.displayslot", "pk": 3, "fields": { "slot_type": "pickup",   "post": 3, "order": 1 } }
]

docker compose run --rm web python manage.py loaddata initial_data

docker compose run --rm web python manage.py dumpdata blog --indent 2 > blog/fixtures/initial_data.json

from django.shortcuts import render

from .models import Category, DisplaySlot, Post


def index(request):
    """トップページ（記事一覧）を表示する。"""

    # 公開済みの記事を新しい順に取得する（モデルの ordering と揃える）
    published = Post.objects.filter(is_published=True).order_by('-published_at', '-id')

    # 特集バナー：管理画面で選ばれたスロットの先頭1件
    # スロットが未設定の場合は最新の公開記事を代わりに表示する
    # post__is_published=True で「下書きをスロットに入れた時にトップへ漏れる」のを防ぐ
    featured_slot = (
        DisplaySlot.objects
        .filter(slot_type=DisplaySlot.SLOT_FEATURED, post__is_published=True)
        .select_related('post')
        .first()
    )
    featured = featured_slot.post if featured_slot else published.first()

    # ピックアップ：管理画面で選ばれた記事を表示順に並べる（下書きは除外）
    pickup = (
        DisplaySlot.objects
        .filter(slot_type=DisplaySlot.SLOT_PICKUP, post__is_published=True)
        .select_related('post')
        .order_by('order')
    )
    pickup_posts = [slot.post for slot in pickup]

    # 記事一覧：特集・ピックアップを除いた公開記事を新しい順に表示する
    exclude_pks = [p.pk for p in pickup_posts]
    if featured:
        exclude_pks.append(featured.pk)
    post_list = published.exclude(pk__in=exclude_pks)

    # サイドバー：よく読まれている記事（閲覧数の多い順で3件）
    popular_posts = published.order_by('-view_count')[:3]

    # サイドバー：カテゴリ一覧
    categories = Category.objects.all()

    context = {
        'featured': featured,
        'pickup': pickup_posts,
        'post_list': post_list,
        'popular_posts': popular_posts,
        'categories': categories,
    }
    return render(request, 'blog/index.html', context)

{# 記事一覧（DBの公開記事。特集・ピックアップを除いた残り） #}
{% for post in post_list %}
<article class="blog-post mb-4">
    <h2 class="display-5 mb-1">{{ post.title }}</h2>
    <p class="blog-post-meta text-secondary">
        {{ post.published_at|date:"Y年n月j日" }}
        {% if post.category %}・{{ post.category.name }}{% endif %}
    </p>
    <p>{{ post.summary }}</p>
</article>
{% empty %}
<p>まだ記事がありません。</p>
{% endfor %}

cd ~/myblog
docker compose up

管理画面で記事を登録
  ↓
DisplaySlotでトップページの表示を管理
  ↓
views.pyがDBから取得してテンプレートに渡す
  ↓
ブラウザに表示