템플릿 사용하기

Team Friends Project/Django web page & Python

템플릿 사용하기

LeeJHstory 2017. 8. 3. 20:17

템플릿을 사용하기 위해서 elections(app)폴더 아래에 templates 폴더 생성 후 그아래 상위 폴더와 같은 이름인 elections폴더를 만든다.

그 다음 index.html파일을 만든다.

elections app 템플릿과 다른 app의 템플릿을 적용시킬 때 모습

elections 템플릿

장고가 템플릿을 찾는 방식

다른 앱에서 index.html을 사용하면 겹치는 것을 방지하기 위해 앱폴더안에 같은 이름의 폴더를 만들어서 index.html파일을 만든다.

index.html

<!-- C\Code\mysite\elections\templates\elections\index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
  <title>선거 후보</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
    <table class="table table-striped">
        <thead>
        <tr>
            <td><B>이름</B></td>
            <td><B>소개</B></td>
            <td><B>출마지역</B></td>
            <td><B>기호</B></td>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td>가후보</td>
            <td>후보입니다.</td>
            <td>우리나라</td>
            <td>기호1번</td>
        </tr>
        <tr>
            <td>나후보</td>
            <td>후보입니다.</td>
            <td>우리나라</td>
            <td>기호2번</td>
        </tr>
        <tbody>
    </table>
</body>

mysite\elections\templates\elections\index.html을 수정 후

mysite\election\views.py를 수정한다.

홈페이지를 들어가보면 정적으로 만든 페이지가 보여진다.

이제 DB에서 불

러온 정보를 넣으려면 index.html에 Candidate정보를 전달하도록 해본다.

정보 전달을 위하여 딕셔너리를 사용하여 candidates의 정보를 context를 통해 전달한다.

index.html안에서 for문을 쓰기위해서는 {% %}안에서 쓸 수있다. for문 아래 내용에는 {{ }}을 사용한다.

DB내용이 적용된 모습