개발/PYTHON-DJANGO

파이썬 장고 4. 직접코드에서 템플릿 연결로 변경

Aireee 2021. 6. 21. 01:48
300x250
반응형

우리는 지난시간 "연습"을 통해 Hello World 를 브라우저 화면에 표시할 수 있었다. 하지만 홈페이지라는게 단순히 텍스트만 나열하는 것은 아니기 때문에 Html 코드나 Css 등을 이용하여 이미지도 불러오고, 데이터 폼도 이용하고, 데이터베이스를 이용해 자료도 받아오는 등 다양한 활동을 해야만 한다. 그렇게 하기에 HttpResponse 를 이용하여 코드를 바로 출력하는 방식은 소스코드를 복잡하게 만드는데 매우 큰 기여를 한다. 그렇기 때문에 우리는 소스부분은 별도로 뽑아내고, 그 뽑아낸 파일에 내용을 넣는다면 소스코드도 보기 쉬울 뿐만 아니라 내용도 만들기 쉬워질 것이다. 

1. memberApp 폴더 안의 views.py 파일 수정하기

from django.shortcuts import render 
from django.http import HttpResponse 

# Create your views here. 

def hello_world(request): 
	return HttpResponse('Hello world!')

이렇게 되어 있는 파일을 다음과 같이 수정하자

from django.shortcuts import render 

# Create your views here. 

def hello_world(request): 
	return render(request, 'default.html')

여기서 default.html 은 원하는 이름으로 변경해도 무방하다. 아직 만들지도 않은 파일인데 앞으로 만들게될 파일이라고 생각하면 된다. 

2. templates 폴더 생성 및 templates 폴더를 코어와 연결하기

manage.py 파일이 있는 위치에서 새로운 폴더 templates 를 생성한다. 다른 이름으로 만든다고 해도 뭐라할 사람은 없을 것 같지만, 대다수의 강좌에서 이러한 용어를 사용하는 것 같다. 아무래도 협업을 할 때 서로 알아보기 쉽게 하기위한 무언의 규칙같은 것이 아닌가 한다. 폴더를 만들었다면 그 폴더 안에 default.html 파일을 만들고, 그냥 Hello World 만 써주고 저장한다.

이제, 코어가 templates 의 위치가 어디인지 알 수 있도록 연결을 해주자. 코어의 settings.py 파일을 열고 아래의 부분을 찾는다. 

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 부분이 그냥 [] 비어있다. 이 부분을 채워주어야 한다. 

os.path.join(BASE_DIR, 'templates') 를 괄호 안에 넣어주자

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',
            ],
        },
    },
]

이렇게 만들어지면 된것이다. 그런데 아마도 os 부분에 빨간줄이 쳐져 있을 가능성이 크다. 여기서 os 는 운영체제의 시스템을 이용할 수 있는 것인데, 당연히 os 를 연결해주어야 사용이 가능하다. 같은 파일 맨 윗부분에다가 "import os" 를 넣어주자 따옴표는 빼고

import os

...


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',
            ],
        },
    },
]

이렇게 하면 memberApp 폴더 안의 views.py 파일에서 hello_world 라는 함수가 불려졌을 때 templates 폴더 안의 default.html 을 불러오게 된다. 이제, default.html 파일에 html 코드를 사용해서 페이지 디자인을 하고나면 

http://127.0.0.1:8000/member/hello_world/

부분에 바로 표시가 될 것이다. 당연히 서버를 실행한 뒤에 해야한다.

반응형