Django 템플릿과 렌더링

Django에서는 HTML 처럼 화면 구성을 담당하는 것들을

Template

이라고 부른다.

 

화면 구성을 보여주기 위해서는 Template을 작성해서 유저에게 보여주면 되는데,

여기서 Template을 유저에게 보여준다는 것을 Template을 Render한다 라고 표현한다.

(foods 앱의 template은 costaurant/foods/templates/foods 디렉토리 안에 넣어준다.)

 

#foods/views.py

def index(request):
    return render(request,'foods/index.html')

 

render(request, 우리가 원하는 템플릿의 경로...)

이렇게 작성해주면 render 함수는 우리가 넘겨준 정보를 하나의 응답 즉, HttpResponse 객체를 만들어서 리턴해준다.

 

정리하면 Djago에서 화면 구성을 담당하는 부분을 Template이라고 부르고

Rendering(렌더링)을 통해 HttpResponse 객체로 변환된다.

 

*HTML 파일을 제외하고 웹 페이지를 렌더링 하는 과정에서 필요한 추가적인 파일들,

CSS나 Javascript, 이미지, 폰트 등을

'정적 파일(static files)라고 한다.

template 파일 구조: foods/templates/foods (앱이름/templates/앱이름)

정적 파일 구조: foods/static/foods (앱이름/static/앱이름)

django에는 이런 정적 파일을 관리하는 디렉토리의 구조가 정해져 있기 때문에 그것을 따라 작성해야 한다.

html 파일 제일 위에

{% load static %}

를 적어주고

css는 href로, images는 src로 경로 표시해주면 ok!

src = "{% static 'foods/images/foods/burger.jpg' %}"

 

 

(1) 템플릿 상속

django에서는 템플릿의 반복적인 부분들을 템플릿 상속을 통해 해결할 수 있어요.

템플릿들의 공통되는 부분을 부모파일로 만들고 그 자식파일은 부모파일을 상속 받아서 작성하는 것입니다.

템플릿 상속은

{% block 블록이름 %}

{% extends 블록이름 %}

템플릿 태그를 사용해서 구현합니다.

부모 파일에서 자식 템플릿에서 코드를 넣어주는 부분을 블록으로 지정해주면 됩니다.

그 뒤 자식 파일의 제일 위에

{% extends '부모파일경로' %}

를 표시해주고

block을 사용해서 내용을 채워줍니다.

 

<render 함수>

render(request, template_name, context=None, context_type=None, status=None, using=None)

 

render 함수는 인자로 주어진 템플릿을 사전형(dict) 인자인 context와 결합해서 렌더링을 거친 다음

HttpResponse 객체로 반환하는 함수에요.

즉, 인자로 넘겨주는 템플릿과 context 데이터를 합쳐서 HttpResponse 객체로 돌려주는 함수!!

 

필수 인자는 request와 template_name이다.

 

request: 데이터를 요청한 요청 객체를 넘겨준다.

template_name: 렌더링에 사용할 대상 템플릿을 적어준다.

context: 템플릿에 추가할 값들이 들어 있는 사전형 인자로 기본 값은 아무것도 없는 None이다.

context_type: 결과로 만들어 내는 문서의 유형을 말하며, 기본값은 'text/html' 즉 HTML 웹 페이지다.

status: 상태 코드 값이면 기본값은 200(성공)이다.

using: 템플릿을 렌더하는 템플릿 엔진을 지정할 수 있는 인자이다.

 

 

Django Template Language를 써서 작성한 코드를 읽어서 일반적인 HTML 코드로 바꿔주는 과정도 rendering이라고 하고,

이 HTML 파일을 브라우저가 읽어서 우리가 실제로 보는 웹 페이지로 바꿔주는 과정도 rendering이라고 한다. 

즉, 서버에서 Django 코드를 render해서 HTML 파일로 만들고

그 다음 웹 브라우저에서 HTML 파일을 render해서 우리가 보는 웹페이지로 바꿔주는 것!!! 

 

 

(2) 동적 웹 사이트 만들기

render의 세번째 인자인 context를 사용해서 날짜처럼 동적으로 바뀌는 웹사이트를 만들어 줄 수 있어요.

view에서 데이터를 가공하고 그 데이터를 template으로 넘긴 뒤 template에서 그 데이터를 사용하는 것인데요.

(이때 데이터를 넘겨줄 때에는 꼭 사전형으로 넘겨줘야합니다.)

# foods/views.py
from django.http.response import Http404, HttpResponse
from django.shortcuts import render
from django.http import HttpResponse
from datetime import datetime
# Create your views here.


def index(request):
    today = datetime.today().date()
    context = {"date": today}
    return render(request, 'foods/index.html', context=context)

view 에서 template으로 넘긴 데이터로 변환되는 것은 템플릿 변수이므로 

템플릿 변수를 사용해서 작성을 해줍니다.

<div>{{date}}</div>