[Django] Template 상속

Template 상속이란

템플릿 상속은 중복되는 코드를 한 번만 작성하고 재사용하는 기능이다.

중복되는 코드를 하나의 html 파일에 넣어 효율적으로 관리한다.

{% extends 'base.html' %}

{% block content %}
{% endblock %}

Template 상속 방법

1.

중복되는 코드를 넣어놓을 파일 하나를 생성한다.

주로 파일 이름은 base.html로 생성한다. (app/templates/base.html 생성)

 

2.

중복되는 코드를 모두 복사 붙여넣기하여 넣는다.

 

3.

중복 코드 중간에 페이지별로 다른 코드가 들어가는 부분에는 {% block content %}와 {% endblock %}을 넣는다.

{% block content %}, {% block preview %} 등 여러 개의 block을 만들 수 있다.

# base.html

<!-- 공통 코드가 들어가는 부분 -->
{% block content %}
<!--서로 다른 코드가 들어가는 부분 -->
{% endblock %}
<!-- 공통 코드가 들어가는 부분 -->

 

4.

이제 각 페이지에서 {% extends 'base.html' %}를 적어 공통코드를 상속받고, 개별적으로 다른 코드는 {% block content %}과 {% endblock %} 사이에 적어준다

# 각 페이지.html

{% extends 'base.html' %}
<!-- 공통 코드가 들어가는 부분 -->
{% block content %}
	<!--서로 다른 코드가 들어가는 부분 -->
	<div class="alert alert-success" role="alert">
		<h4 class="alert-heading">This is Homepage.</h4>
		<p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p>
		<hr>
		<p class="mb-0">Whenever you need to, be sure to use margin utilities to keep things nice and tidy.</p>
	</div>
{% endblock %}