템플릿을 상속받는 이유

HTML코드를 보면 <!DOCTYPE html>부터 </html>까지 중복적으로 사용하는 코드가 많을때 이 부분을 따로 html로 만들고 그대로 해당 코드들을 상속받아 편하게 사용할때 사용합니다.

1. 상속해줄 부모파일 만들기

layout.html이라는 파일을 만들어주고 중복적으로 쓰는 코드들을 넣어줍니다.

여기서 title과 body부분은 페이지마다 다르기 때문에 {% block %}을 사용합니다.

메인페이지인 index.html입니다.

아까 title은 block해줬었는데요 이부분만 빼고 지워줍니다.

{% extends "elections/layout.html %}은 "경로"안에 있는 파일을 extends해서 상속받겠다는 뜻입니다.

{% block title %} {% endblock %}사이에 타이틀정보를 넣어줍니다.

{% block content %} {% endblock %} 사이에 내용정보를 넣어줍니다.

확인해보면 상속이 잘받아지네요