Django 5. 템플릿 문법

 Django 5. 템플릿 문법

* 템플릿 문법

파이썬을 html로 변환시켜서 빠르고 쉽게 동적 웹사이트를 만들 수 있게 도와줌

1. {{  }}

변수를 의미

view의 render 함수의 마지막 매개변수로 전달된 파라미터에 파라미터 이름으로 접근

{{ }} 안에 파라미터 이름을 작성하면 해당 파라미터의 값을 화면에 출력

2. 템플릿 태그 {%    %}

html 상에서 프로그램 로직을 이용할 수 있는 태그

load static, for, if 등을 이용 가능 ( {% endfor %}, {% endif %} 로 닫아줘야 함)

and, or, not, and not, >, >=, <, <=, ==, in, not in, 등의 비교 연산 가능

{% csrf_token %} 

 CSRF 공격을 방지하기 위한 태그로 장고 내부적으로 CSRF 토큰 값의 유효성 검증

 form 태그 의 첫 줄에 작성하고 없으면 post 시 에러 발생

{% load ... %}

사용자 정의 태그 및 필터링 데이터, 정적 파일을 가져옴

static 폴더를 가져와서 템플릿의 css, javascirpt를 적용하도록 해줌

{% extends ... %}, {% block content %}

템플릿 확장에 사용

템플릿 파일에 전달받은 내용을 표시할 부분에 {% block content %}{% endblock %} 작성

템플릿을 불러오는 파일의 상단에 {% extends [불러올 템플릿 파일] %} 을 작성하고 템플릿 파일의 {% block %} 부분에 표시할 내용을 {% block content %}{% endblock %} 사이에 작성

{%  with %}{% end with %}

{% with %} 안에 특정 변수를 선언하고 값을 저장하면 {% endwith %} 로 닫기 전까지 해당 변수를 사용할 수 있음

{% url %}

a 태그의 href 속성 등 url을 지정할 때 사용

"[앱 이름] : [path 이름]" 지정 (앱 이름은 urls.py 파일에 app_name 변수에 문자열로 지정)

파라미터로 전달할 값 작성 가능

<a href="{% url "polls:detail" question_id=10 %}">

3. 템플릿 필터 {[변수 명] | [필터 명]}

템플릿 변수의 값을 특정한 형식으로 변환

length, upper, lower, linebreaksbr(행 바뀔 시 문단 바꿈) 등 이용 가능

* 예시 - view의 read, index 함수를 render 함수를 이용해 html 파일로 불러오고 템플릿 적용

view.py - index, read 함수

def index(request):

return render(request, "myApp/index.html", {"topics": topic})

def read(request, id):

global topic

for t in topic:

if t["id"] == int(id):

return render(request,"myApp/read.html",{"topics":topic,"t":t})

template.html

<!DOCTYPE html>

<body>

<h1><a href="/">Django</a></h1>

<ol>

{% for topic in topics %}

<li><a href="/read/{{topic.id}}">{{topic.title}}</a></li>

{% endfor %}

</ol>

{% block content %}

{% endblock %}

<ul>

<li><a href='/create/'>create</a></li>

</ul>

</body>

</html>

{% for %}를 이용해서 목록 리스트를 전달받은 topics 파라미터의 값을 표시

{% block content %}{% end block %} 부분은 템플릿을 확장하는 html 파일의 내용 표시

index.html

{% extends 'template.html' %}

{% block content %}

<h2>Welome</h2>

Hello World

{% endblock %}

read.html

{% extends "template.html" %}

{% block content %}

<h2>{{t.title}}</h2>

{{t.body}}

{% endblock %}