Django で Page not found になる

Question

前提・実現したいこと

プログラミング、Django 初心者です。
「Djangoのツボとコツがゼッタイにわかる本」を参考にブログアプリケーションを作成して
そこから拡張を行っています。

同一プロジェクト内にアプリケーションを追加しようと思い、処理を作っていたところ
Page not found (404) のエラーが発生したためご質問させていただきます。

発生している問題・エラーメッセージ

エラーの再現方法を記載いたします。

①以下にアクセスします。
http://54.65.18.228/njiro/list/

②適当な「詳細へ」ボタンをクリックすると以下のエラーが発生します。

Page not found (404)
クエリーに一致する result model は見つかりませんでした
Request Method:	GET
Request URL:	http://54.65.18.228/pekora/detail/4/
Raised by:	vscwebpekora.views.VscwebDetail
Using the URLconf defined in vscwebproject.urls, Django tried these URL patterns, in this order:

admin/
njiro/
pekora/ list/ [name='list']
pekora/ detail/<int:pk>/ [name='detail']
The current path, pekora/detail/4/, matched the last one.

逆に以下の流れではエラーが発生しませんでした。

①以下にアクセスします。
http://54.65.18.228/pekora/list/

②「詳細へ」ボタンをクリックします。

該当のソースコード

関連するであろうか所を記載いたします。

/var/www/vscwebproject/vscwebproject/urls.py

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('njiro/', include('vscwebnjiro.urls')),
    path('pekora/', include('vscwebpekora.urls')),
]

/var/www/vscwebproject/vscwebnjiro/urls.py

from django.urls import path
from .views import VscwebList, VscwebDetail

urlpatterns = [
    path('list/', VscwebList.as_view(), name='list'),
    path('detail/<int:pk>/', VscwebDetail.as_view(), name='detail'),
]

/var/www/vscwebproject/vscwebpekora/urls.py

from django.urls import path
from .views import VscwebList, VscwebDetail

urlpatterns = [
    path('list/', VscwebList.as_view(), name='list'),
    path('detail/<int:pk>/', VscwebDetail.as_view(), name='detail'),
]

/var/www/vscwebproject/vscwebnjiro/views.py

{% extends 'base.html' %}

{% block header %}
{% endblock header %}

{% block content %}
    <div class='container'>
    {% for item in object_list %}
      <div class="card">
        <h6 class="card-header">{{ item.videoTitle }}</h6>
        <div class="card-body">
          {# <h6 class="card-title"></h6> #}
          <img src="{{ item.s3ThumbnailUrl }}">
          <p class="card-text">配信開始時間 : {{ item.startTime }}</p>
          <a href="{% url 'detail' item.pk %}" class="btn btn-primary">詳細へ</a>
        </div>
      </div>
    {% endfor %}
    </div>
{% endblock content %}

試したこと

/var/www/vscwebproject/vscwebproject/urls.py
にて

    path('njiro/', include('vscwebnjiro.urls')),
    path('pekora/', include('vscwebpekora.urls')),

の順番を上下入れ替えたところ、
逆に
http://54.65.18.228/njiro/list/ から詳細へボタンクリックではではエラーが出ずに
http://54.65.18.228/pekora/list/ から詳細へボタンクリックでエラーが出ました。

そのため、urls.py 関連で問題があると思っているのですが、
その線で調べても解決ができなかったため今回質問させていただきました。

恐れ入りますが、よろしくお願いします。

Answer 1

自己解決いたしました。

もともとこのようなファイルをテンプレートで作成していました。

/var/www/vscwebproject/templates/list.html

{% extends 'base.html' %}

{% block header %}
{% endblock header %}

{% block content %}
    <div class='container'>
    {% for item in object_list %}
      <div class="card">
        <h6 class="card-header">{{ item.videoTitle }}</h6>
        <div class="card-body">
          {# <h6 class="card-title"></h6> #}
          <img src="{{ item.s3ThumbnailUrl }}">
          <p class="card-text">配信開始時間 : {{ item.startTime }}</p>
          <a href="{% url 'detail' item.pk %}" class="btn btn-primary">詳細へ</a>
        </div>
      </div>
    {% endfor %}
    </div>
{% endblock content %}

<a href="{% url 'detail' item.pk %}" class="btn btn-primary">詳細へ</a> の
「url 'detail'」 がよくないことに気づきました。

そこで、以下のようなテンプレートファイルを作りました。

/var/www/vscwebproject/templates/listnjiro.html

{% extends 'base.html' %}

{% block header %}
{% endblock header %}

{% block content %}
    <div class='container'>
    {% for item in object_list %}
      <div class="card">
        <h6 class="card-header">{{ item.videoTitle }}</h6>
        <div class="card-body">
          {# <h6 class="card-title"></h6> #}
          <img src="{{ item.s3ThumbnailUrl }}">
          <p class="card-text">配信開始時間 : {{ item.startTime }}</p>
          <a href="/njiro/detail/{{ item.pk }}" class="btn btn-primary">詳細へ</a>
        </div>
      </div>
    {% endfor %}
    </div>
{% endblock content %}

これで起きていた事象は解決しました。
アプリケーションごとにこのテンプレートファイルを作るという方法が
ベストプラクティスかどうかはわかりませんが、一旦これで解決とします。

お騒がせいたしました。