Templates

  • Template μ–Έμ–΄λŠ” 각 framework λ§ˆλ‹€ λ‹€λ₯΄λ‹€

  • Django의 template μ–Έμ–΄λŠ” DTL !

DTL (Django Template Language)

Ground Rule

: 연산은 DTL이 μ•„λ‹Œ views.py 의 context둜 κ³„μ‚°λœ κ²°κ³Όλ₯Ό DTL은 λ‹¨μˆœνžˆ 좜λ ₯ν•˜λŠ” μ—­ν• λ§Œ ν•˜κ²Œ ν•˜κΈ°

κΈ°λ³Έ 문법

1. 좜λ ₯ {{ }}

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

2. 문법 `{% %}

`


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

</div>

3. 주석

{# This is comment #}

반볡문

Loops over each item in an array


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

	<p> {{reply}} </p>

</div>
{{ forloop.counter }}
{{ forloop.counter0 }}

<div data-gb-custom-block data-tag="empty"></div>
  • 배열이 λΉ„μ–΄μžˆμœΌλ©΄ 좜λ ₯ν•  λ‚΄μš© 써쀄 λ•Œ μ‚¬μš©

Loop over each item in a dictionary


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

    {{ key }}: {{ value }}

</div>

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

쑰건문


<div data-gb-custom-block data-tag="if" data-0='admin' data-1='admin'>

    <p> Accessible</p>

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

    <p> Inaccessible</p>

</div>

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>
    

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

    

</div>

</head>
<body>
    <h1> Django Basic Syntax</h1>
    

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

    

</div>

</body>
</html>

posts.html


<div data-gb-custom-block data-tag="extends" data-0='base.html'></div>

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

<style>

    h1 {
        color: blue;
    }
</style>

</div>

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

    <!-- {# Template language μ—μ„œμ˜ 주석 #} -->
    <h1> Post No. {{id}}</h1>
    <p> {{content}}</p>
    <p> {{content | length}}</p>
    <p> {{content|truncatechars:10}}</p>
    <hr>
    

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

        <p> {{forloop.counter}} {{reply}}</p>
    

</div>

    <hr>

    

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

        <p> {{forloop.counter}} {{reply}}</p>
        

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

        <p> There's no reply γ… _γ… </p>
    

</div>

    <hr>
    

<div data-gb-custom-block data-tag="if" data-0='admin' data-1='admin'>

        <p> Accessible</p>
    

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

        <p> Inaccessible</p>
    

</div>

</div>

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 처리

  1. μ‚¬μš©μžλ“€λ‘œλΆ€ν„° 값을 λ°›μ•„μ„œ (boards/new/)

  2. λ‹¨μˆœ 좜λ ₯ν•˜λŠ” 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 .

Last updated

Was this helpful?