Django에서는 부모 템플릿(base.html) 과
이를 상속받는 자식 템플릿(index.html) 구조를 자주 사용합니다.
이 방식의 핵심은 공통 구조는 부모에, 내용은 자식에 두는 것입니다.
1. 부모 템플릿 (base.html)
부모 템플릿에는 전체 페이지의 뼈대와
자식이 끼워 넣을 수 있는 block을 정의합니다.
<body>
<div>
{% block date-block %}
{% endblock %}
</div>
<hr>
<h1>코스토랑</h1>
<h2>난 코딩할때가 제일 이뻐</h2>
<div class="food-container">
{% block food-container %}
{% endblock %}
</div>
</body>
이 상태만 보면 내용은 비어 있고 틀만 존재합니다.
2. 자식 템플릿 (index.html)
자식 템플릿은 부모를 상속받아
필요한 블록만 선택적으로 채웁니다.
{% extends "./base.html" %}
{% load static %}
{% block date-block %}
<div>12 Aug, 2020</div>
{% endblock %}
{% block food-container %}
<div class="food">
<img src="{% static 'foods/images/chicken.jpg' %}">
<h3>코딩에 빠진 닭</h3>
</div>
{% endblock %}
extends는 항상 파일 최상단에 있어야 합니다.
3. 부모·자식 템플릿 동작 원리
부모만 block 내용을 가진 경우
→ 부모 템플릿 내용이 그대로 출력
부모 + 자식 모두 block 내용이 있는 경우
→ 자식 템플릿 내용으로 오버라이딩
4. 정리하면
- 부모 템플릿: 공통 레이아웃
- 자식 템플릿: 페이지별 내용
- block이 없으면 → 부모 내용 사용
- block이 있으면 → 자식 내용으로 덮어씀(override)
이 구조 덕분에
중복 없는 HTML 관리 + 유지보수 쉬운 구조를 만들 수 있습니다.
'Django 프론트& 백엔드 개발' 카테고리의 다른 글
| Django에서 동적 URL(Dynamic URL) 사용하기 (0) | 2026.01.04 |
|---|---|
| 데이터 전달로 동적 웹 페이지 개념 (0) | 2026.01.04 |
| 템플릿 언어 이해하기 (0) | 2026.01.04 |
| Django에서 템플릿·정적 파일을 샌드위치 구조로 쓰는 이유 (0) | 2026.01.04 |
| 정적 파일(static files)이란? (0) | 2026.01.04 |