Django Template

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

project/settings.pyTEMPLATES 관련 설정을 하고 있는 것을 볼 수 있다. 여기서는 어떻게 tmeplate을 불러오고 렌더링 할 것인지를 설정할 수 있다.

'APP_DIRS': TrueINSTALLED_APPS 디렉토리의 templates 하위 디렉토리를 탐색한다.

Template 파일 생성하기

템플릿을 생성할 app 디렉토리 하위에 templates 디렉토리를 생성한다. templates 디렉토리 하위에 polls 디렉토리 내부에 index.html 파일을 생성해준다.

polls
├── __init__.py
├── admin.py
├── apps.py
├── migrations
│   ├── 0001_initial.py
│   ├── __init__.py
├── models.py
├── templates
│   └── polls
│       └── index.html
├── tests.py
├── urls.py
└── views.py

polls/templates/polls/index.html 과 같은 형태가 된다. 여기서 왜 templates 디렉토리 하위에 polls 디렉토리를 생성해준걸까?

Django에서는 이름이 일치하는 첫번째 template을 선택한다. 만약 동일한 template이 다른 어플리케이션에 있을 경우에 이 둘의 차이를 구분하지 못한다. 가장 정확한 template을 지정하기 위해서 가장 편리한 방법은 이름공간으로 구분짓는 것이다.

<!-- polls/index.html -->

<div data-gb-custom-block data-tag="if"></div>

	<ul>
		

<div data-gb-custom-block data-tag="for">

			<li><a href="/polls/{{question.id}}/">{{ question.question_text}}</a></li>
		

</div>

	</ul>

<div data-gb-custom-block data-tag="else">

   <p>No polls are avaliable.</p>

</div>{%%}{%` `%}

` 태그 안에는 python의 for문, if문과 같이 탬플릿의 로직을 제어한다.

```html

<div data-gb-custom-block data-tag="if" data-0='0' data-1='0' data-2='0' data-3='0' data-4='0'></div>

    Data Count = {{ count }}

<div data-gb-custom-block data-tag="else">

    No Data

</div>

 

<div data-gb-custom-block data-tag="for">

  <li>{{ item.name }}</li>

</div>

 

<div data-gb-custom-block data-tag="csrf_token"></div>

{{ | }} 필터

템플릿 필터는 변수의 값을 특정한 포맷으로 변형하는 기능을 한다. 이때 | 파이프를 사용해 필터를 적용한다.

예를 들어, 날짜를 특정 날짜 포맷으로 변경하거나, 문자열을 대,소문자로 변경하는 기능을 할 수 있다.

<!--날짜 포맷 지정-->
{{ createDate|date:"Y-m-d" }}
 
<!--소문자 변경-->
{{ lastName|lower }}

<!-- 라인 변경 -->
{{ post.text|linebreaksbr }}

내장 필터 레퍼런스 에서 전체 목록을 볼 수 있으며, 템플릿 필터를 직접 만들 수 있다.

{##} 주석

템필릿에서 주석구문은 {# #}이다.

{# 주석, 코드에 대한 설명 #}

HTML Escape

HTML 내용중에 <,>,',",& 과 같은 문자들이 있으면 그 문자에 상응하는 HTML Entity로 변환해주어야한다.

템플릿에서 이러한 작업을 자동으로 처리해주기 위해서 `

템플릿 태그나escape` 템플릿 필터를 사용한다.

# autoescape 태그

<div data-gb-custom-block data-tag="autoescape">

     
    {{ content }}

</div>

# escape 필터
{{ content|escape }}    

참조

Last updated