自作ページを表示するまでの手順 – PART1 (Django) | Python-izm

自作ページを表示するまでの手順 – PART1

ここでは作成したDjangoプロジェクトとDjangoアプリケーションへ記述を加え、自らが作成したページをWebブラウザ上で表示するまでの手順を記載します。カスタマイズすることを前提としているため、必要最低限の手順ではありませんが、その分さまざまな場面で活用することができます。
ここでは目標として次のことを行えるようにします。

  • トップページhttp://localhost:8000/へアクセスした時に、サンプルページではなく独自のページを表示する

urls.pyの編集

まずはDjangoプロジェクトを作成した時に生成されたC:¥python¥sports¥sports配下のurls.pyを開きます。



    
 
  • c:
 
      
  
    • python
   
        
    
      • sports
     
          
      
        • event
       
            
        
          • migrations
         
              
          
            • __init__.py
              • 
         
            
        
            • 
        
          • __init__.py
            • 
        
          • admin.py
            • 
        
          • apps.py
            • 
        
          • models.py
            • 
        
          • tests.py
            • 
        
          • views.py
            • 
       
           
      
          • 
     
         
     
          
      
        • sports
       
            
        
          • __init__.py
            • 
        
          • settings.py
            • 
        
          • urls.py
            • 
        
          • wsgi.py
            • 
       
           
      
          • 
      
        • manage.py
          • 
     
         
    
        • 
   
       
  
      • 
 
     
 
    •

Djangoのバージョンによっても異なりますが、おおよそ以下のような内容で生成されています。

"""sports URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:
    https://docs.djangoproject.com/en/2.0/topics/http/urls/
Examples:
Function views
    1. Add an import:  from my_app import views
    2. Add a URL to urlpatterns:  path('', views.home, name='home')
Class-based views
    1. Add an import:  from other_app.views import Home
    2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
Including another URLconf
    1. Import the include() function: from django.urls import include, path
    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
"""
from django.contrib import admin
from django.urls import path

urlpatterns = [
    path('admin/', admin.site.urls),
]

このファイルに対し、以下のように追加を行います。

"""sports URL Configuration

The `urlpatterns` list routes URLs to views. For more information please see:
    https://docs.djangoproject.com/en/2.0/topics/http/urls/
Examples:
Function views
    1. Add an import:  from my_app import views
    2. Add a URL to urlpatterns:  path('', views.home, name='home')
Class-based views
    1. Add an import:  from other_app.views import Home
    2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
Including another URLconf
    1. Import the include() function: from django.urls import include, path
    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
"""
from django.contrib import admin
from django.urls import path

from sports import views

urlpatterns = [
    path('', views.index, name='index'),
    path('admin/', admin.site.urls),
]

pathの第一引数にはURLパターンを、第二引数にはURLパターンに対するビューを、name引数にはこのURLパスに対する名称を指定します。このurls.pyは最上位のURL定義であるため、この場合の空の文字列はトップページを表します。それに対応するビューはsports.viewsモジュールのindex関数を指定していますが、まだ存在していないのでこれから作成します。

views.pyの編集

次はC:¥python¥sports¥sports下へviews.pyを作成します。一から記述するため、すでに存在しているC:¥python¥sports¥event下のviews.pyをコピーしてきても構いません。



    
 
  • c:
 
      
  
    • python
   
        
    
      • sports
     
          
      
        • event
       
            
        
          • migrations
         
              
          
            • __init__.py
              • 
         
            
        
            • 
        
          • __init__.py
            • 
        
          • admin.py
            • 
        
          • apps.py
            • 
        
          • models.py
            • 
        
          • tests.py
            • 
        
          • views.py
            • 
       
           
      
          • 
     
         
     
          
      
        • sports
       
            
        
          • __init__.py
            • 
        
          • settings.py
            • 
        
          • urls.py
            • 
        
          • wsgi.py
            • 
        
          • views.py
            • 
       
           
      
          • 
      
        • manage.py
          • 
     
         
    
        • 
   
       
  
      • 
 
     
 
    •

以下のように記述してください。関数名はindexで、引数を１つ受け取ります。戻り値としてrenderの第一引数にそのままrequestを、第二引数にテンプレートファイル名を、第三引数にコンテキスト（ここでは空のディクショナリ）を指定します。views.pyと同様、テンプレートファイルindex.htmlはまだ存在していないのでこれから作成します。

from django.shortcuts import render

def index(request):
    return render(request, 'sports/index.html', {})

テンプレートファイルの追加

次はC:¥python¥sports下へテンプレートファイルを配置するディレクトリ、templatesを作成し、その下にindex.htmlを作成します（間にsportsディレクトリを挟みます）。



    
 
  • c:
 
      
  
    • python
   
        
    
      • sports
     
          
      
        • event
       
            
        
          • migrations
         
              
          
            • __init__.py
              • 
         
            
        
            • 
        
          • __init__.py
            • 
        
          • admin.py
            • 
        
          • apps.py
            • 
        
          • models.py
            • 
        
          • tests.py
            • 
        
          • views.py
            • 
       
           
      
          • 
     
         
     
          
      
        • sports
       
            
        
          • __init__.py
            • 
        
          • settings.py
            • 
        
          • urls.py
            • 
        
          • wsgi.py
            • 
        
          • views.py
            • 
       
           
      
          • 
      
        • templates
       
            
        
          • sports
         
              
          
            • index.html
              • 
         
            
        
            • 
       
          
      
          • 
      
        • manage.py
          • 
     
         
    
        • 
   
       
  
      • 
 
     
 
    •

テンプレートファイルへ記述する内容はHTMLであれば何でも構いません。ここでは例として次のような内容で作成を行います。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>トップページ</title>
</head>
<body>
  メニュー
  <ul>
    <li>リンクA</li>
    <li>リンクB</li>
    <li>リンクC</li>
  </ul>
</body>
</html>

Djangoプロジェクトディレクトリ配下（C:¥python¥sports）へテンプレートファイルディレクトリ（templates）およびテンプレートファイル（index.html）を作成したため、このままではDjangoプロジェクト上で認識されません。最後にそのための設定を追加します。

settings.pyの編集

最後はC:¥python¥sports¥sports下のsettings.pyを編集します。その目的は、テンプレートファイルディレクトリを認識させ、その配下へ配置されているテンプレートファイルをDjangoプロジェクト上で使用できるようにします。



    
 
  • c:
 
      
  
    • python
   
        
    
      • sports
     
          
      
        • event
       
            
        
          • migrations
         
              
          
            • __init__.py
              • 
         
            
        
            • 
        
          • __init__.py
            • 
        
          • admin.py
            • 
        
          • apps.py
            • 
        
          • models.py
            • 
        
          • tests.py
            • 
        
          • views.py
            • 
       
           
      
          • 
     
         
     
          
      
        • sports
       
            
        
          • __init__.py
            • 
        
          • settings.py
            • 
        
          • urls.py
            • 
        
          • wsgi.py
            • 
        
          • views.py
            • 
       
           
      
          • 
      
        • templates
       
            
        
          • sports
         
              
          
            • index.html
              • 
         
            
        
            • 
       
          
      
          • 
      
        • manage.py
          • 
     
         
    
        • 
   
       
  
      • 
 
     
 
    •

Djangoのバージョンによっても異なりますが、おおよそ以下のような内容で生成されています（ファイル後半部分は省略しています）。ファイルを開いたのち、TEMPLATESで検索してください（ここでは54行目）。

"""
Django settings for sports project.

Generated by 'django-admin startproject' using Django 2.0.1.

For more information on this file, see

Django
The web framework for perfectionists with deadlines.
docs.djangoproject.com


For the full list of settings and their values, see

Django
The web framework for perfectionists with deadlines.
docs.djangoproject.com

"""

import os

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/2.0/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'h@khrq3*n2$o9ckmngs0m+e3x9qim*8#i+_0*&k8h*g(%ugjf+'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True

ALLOWED_HOSTS = []


# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'sports.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

# 以下略

TEMPLATESへ記述されている設定が、テンプレートファイルディレクトリに関するものです。このDIRSを次のように変更してください。

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

BASE_DIRは同ファイルの上部で設定されている値です（ここでは16行目で設定されています、1行目から表示しているsettings.pyの方を見れば確認することができます）。BASE_DIRはc:¥python¥sportsとなるため、上記設定で先ほど作成したテンプレートファイルディレクトリを指し示しめすことになります。

Webブラウザで表示確認

すべての設定ができましたので、Webブラウザで表示を確認してみましょう。コマンドプロンプトでmanage.pyがあるディレクトリへ移動し、テストサーバーを起動します。

python manage.py runserver

待ち受け状態となったことを確認したら、Webブラウザで下記URLを入力してトップページを開きます。例のような画面が表示されれば問題ありません。

http://127.0.0.1:8000/
127.0.0.1

なお、urls.py、views.py、テンプレートファイルディレクトリなどの設定を変更すれば、必ずしもこのページで示したようなディレクトリへ配置しなくても構いません。たとえばトップページのviews.pyは別途Djangoアプリケーションを作成してそこに配置する（たとえばtopという名前で作成し、その配下へviews.pyを作成する）、テンプレートファイルディレクトリはDjangoプロジェクトと同じ階層のディレクトリ（たとえばC:¥python）に配置するなど、開発者の設計方針によって容易に変更することが可能です。