Templates

Template 언어는 각 framework 마다 다르다
Django의 template 언어는 DTL !

DTL (Django Template Language)

Ground Rule

: 연산은 DTL이 아닌 views.py 의 context로 계산된 결과를 DTL은 단순히 출력하는 역할만 하게 하기

기본 문법

1. 출력 `{{ }}`

{{ menu }}
{{ menu.0 }}

2. 문법 `{% %}`

{% for menu in menus %}

{% endfor %}

3. 주석 ``

{# This is comment #}

반복분

Loops over each item in an array

{% for reply in replies %}
    <p> {{reply}} </p>
{% endfor %}

{{ forloop.counter }}
{{ forloop.counter0 }}
`
`
: 배열이 비어있으면 출력할 내용 써줄 때 사용

Loop over each item in a dictionary

{% for key, value in data.items %}
    {{ key }}: {{ value }}
{% endfor %}

Variable

Description

forloop.counter

The current iteration of the loop (1-indexed)

forloop.counter0

The current iteration of the loop (0-indexed)

forloop.revcounter

The number of iterations from the end of the loop (1-indexed)

forloop.revcounter0

The number of iterations from the end of the loop (0-indexed)

forloop.first

True if this is the first time through the loop

forloop.last

True if this is the last time through the loop

forloop.parentloop

For nested loops, this is the loop surrounding the current one

조건문

{% if user == 'admin' %}
    <p> Accessible</p>
{% else %}
    <p> Inaccessible</p>
{% endif %}

built-in tag, filter (`|`)

공식문서 참고하자 : https://docs.djangoproject.com/en/3.0/ref/templates/builtins/

length

{{content | length}}

길이 확인하기

truncatechars:num

{{content|truncatechars:10}}

10자만 짤라서 보이기

dictsort

{{ value|dictsort:"name" }}

dictionary 자료형일때, 명시한 key를 기준으로 정렬

Template 확장

pages/templates/base.html

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Django Basics - Pages</title>
    {% block css %}
    {% endblock %}
</head>
<body>
    <h1> Django Basic Syntax</h1>
    {% block body %}

    {% endblock %}
</body>
</html>

posts.html

{% extends 'base.html' %}

{% block css %}
<style>

    h1 {
        color: blue;
    }
</style>

{% endblock %}


{% block body %}
    <!-- {# Template language 에서의 주석 #} -->
    <h1> Post No. {{id}}</h1>
    <p> {{content}}</p>
    <p> {{content | length}}</p>
    <p> {{content|truncatechars:10}}</p>
    <hr>
    {% for reply in replies %}
        <p> {{forloop.counter}} {{reply}}</p>
    {% endfor %}

    <hr>

    {% for reply in no_replies %}
        <p> {{forloop.counter}} {{reply}}</p>
        {% empty %}
        <p> There's no reply ㅠ_ㅠ</p>
    {% endfor %}
    <hr>
    {% if user == 'admin' %}
        <p> Accessible</p>
    {% else %}
        <p> Inaccessible</p>
    {% endif %}

{% endblock %}

Template 설정 - `DIR`

TEMPLATES = [
    {    
        # DTL 엔진을 활용. jinja2 등으로 변경 가능함
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        # APP 내에 있는 폴더가 아닌 추가적으로 템플릿으로 활용하고 싶은 경로.
        'DIRS': [os.path.join(BASE_DIR, 'intro', 'templates')],
        # APP_DIRS: True 인경우, 등록된 app(INSTALLED_APPS)의 디렉토리에 있는 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

BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

Linux, Windows 등 OS에 상관없이 설정하려고 os.path.dirname()으로 함

DIRS 리스트에 경로 정의 폴더 구조를 통해 확인하기

00_django_intro/ <- BASE_DIR
    django_intro/
        templates/

Multiple Apps

<br

앞으로는 항상 app을 생성하면 다음과 같은 폴더 구조를 가진다.

app1/
    templates/
        app1/
            index.html
            a.thml
    urls.py
    views.py
    ...

app2/
    templates/
        app2/
            index.html
            b.thml
    urls.py
    views.py
    ...

1. url 설정 분리

각각의 app 별로 url을 관리한다.

프로젝트 폴더 urls.py 정의

# django_intro/urls.py
urlpatterns = [
    path('admin/', admin.site.urls),
    path('pages/', include('pages.urls')),
    path('boards/', include('boards.urls')),
]

각 프로젝트별 urls.py 정의

from django.urls import path
from . import views

urlpatterns = [
    # /boards/
    path('', views.index),
    # /boards/new/
    path('new/', views.new),
    # /boards/complete/
    path('complete/', views.complete),
]

2. templates 폴더 구조

template 파일을 반환하기 위해서 django는 아래의 폴더들을 탐색한다.
- DIRS 에 정의된 경로의 하위 디렉토리
- NSTALLED_APPS 디렉토리의 templates 폴더의 하위 디렉토리 탐색
이 과정에서 중복된 파일이 있는 경우, 예상치 못한 결과가 나타날 수 있다.
따라서, 앞으로 다음과 같은 구조를 유지한다.

app1/
    templates/
        app1/
app2/
    templates/
        app2/

Form 을 통한 Request 처리

사용자들로부터 값을 받아서 (boards/new/)
단순 출력하는 page 구성 (boards/complete/)

1. 사용자에게 form 양식 제공

1-1 url 지정

# boards/urls.py
path('new/', views.new),

1-2 view 함수 생성

#boards/views.py
def new (request):
    return render(request, 'boards/new.html')

1-3 template

<form action="/boards/complete/">
    Title: <input type="text" name="title">
</form>

form tag에는 action 속성을 정의한다
- 사용자로부터 내요을 받아서 처리하는 url
input tag에는 name 속성을 통해 사용자가 입력한 내용을 담을 변수 이름을 지정한다
url 예시
- /boards/complete/?title="제목제목"

2. 사용자 요청 처리

2-1. urls.py 정의

bords/url.py

path('/boards/complete', views.complete)

2-2. views.py

boards/views.py

def complete(request):
    title = request.GET.get('title')
    context = {
        'title': title
    }
    return render(request, 'boards/complete.html', context)

request에는 요청과 관련된 정보들이 담긴 object가 저장되어 있다

2-3. template

<!-- boards/templates/boards/complete.html -->
{{ title }}

+

Tip) project 쉽게 만들기!

$ cd intro/
$ django-admin startproject intro .

PreviousRequest and Response Objects NextVariable Routing & DTL

Last updated 4 years ago

hashtagDTL (Django Template Language)

hashtagGround Rule

hashtag기본 문법

hashtag1. 출력 {{ }}

hashtag2. 문법 {% %}

hashtag3. 주석 ``

hashtag반복분

hashtag조건문

hashtagbuilt-in tag, filter (|)

hashtagTemplate 확장

hashtagTemplate 설정 - DIR

hashtagBASE_DIR

hashtagDIRS 리스트에 경로 정의 폴더 구조를 통해 확인하기

hashtagMultiple Apps

hashtag1. url 설정 분리

hashtag2. templates 폴더 구조

hashtagForm 을 통한 Request 처리

hashtag1. 사용자에게 form 양식 제공

hashtag1-1 url 지정

hashtag1-2 view 함수 생성

hashtag1-3 template

hashtag2. 사용자 요청 처리

hashtag2-1. urls.py 정의

hashtag2-2. views.py

hashtag2-3. template

hashtagTip) project 쉽게 만들기!