TechTogetWorld

보호되어 있는 글입니다.
내용을 보시려면 비밀번호를 입력하세요.

확인


 daviduino.co.kr

techtogetworld.com

 david201207.blog.me

cafe.naver.com/3dpservicedavid


투표관련 웹 "vote" Django WEB을 통해 장고의 기능을 확인해 가는 과정입니다.

글의 순서는 아래와 같습니다.


===========================================================================

1. Page Not Found 404 발생시키는 방법
2. Page Not Found 404 발생시 다른 화면으로 넘기는 방법
3. templates 상속으로 코드 분량 줄이기
4. 네비게이션바 코드
  - 각 페이지의 공통 내용을 네비게이션에 등록
5. 화일 사용하기 : 아이콘 화일 적용
6. Ddjango web 시현 : pythonanywhere
7. 소스
8 참고자료

===========================================================================



[ Page Not Found 404 발생시키는 방법]


1. 예외 처리로 object가 없는 경우 HttpResponseNotFound 처리하기

# C:\Code\mysite\elections\views.py


from django.http import HttpResponseNotFound #추가


# 기존 코드 유지


def candidates(request, name):

    try :

        candidate = Candidate.object.get(name = name)

    except:

        return HttpResponseNotFound("없는 페이지 입니다.")

    return HttpResponse(candidate.name)

2. 예외 처리로 url이 없는 경우와, object가 없는 경우를 함께 처리하기

# C:\Code\mysite\elections\views.py


from django.http import Http404 #추가


# 기존 코드 유지


def candidates(request, name):

    try :

        candidate = Candidate.object.get(name = name)

    except:

        raise Http404

    return HttpResponse(candidate.name)

4. 예외 처리없이 url이 없는 경우와, object가 없는 경우를 함께 처리하기

# C:\Code\mysite\elections\views.py


from django.shortcuts import get_object_or_404 #추가


# 기존 코드 유지


def candidates(request, name):

    candidate = get_object_or_404(Candidate, name = name)

    return HttpResponse(candidate.name)


[ Page Not Found 404 발생시 다른 화면으로 넘기는 방법]

1. 디버그 설정과 디렉토리 설정 바꿔주기

# C:\Code\mystie\settings.py


# ...


DEBUG = False #True에서 False로 변경합니다


ALLOWED_HOSTS = ['localhost']


# ...


TEMPLATES = [

    {

        # ...

        'DIRS' : ['templates'],

        # ...

    }

]

2. 404파일 만들어주기

<!--C:\Code\mysite\templates\404.html-->

없는 페이지 입니다.


[ templates 상속으로 코드 분량 줄이기]


1. layout.html 설정

<!-- C:\Code\mysite\elections\templates\elections\layout.html-->


<!DOCTYPE html>

<html lang="en">

<head>

  <title>{% block title %}{% endblock %}</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>

{% block content %}{% endblock %}

</body>

</html>

2. 각 html파일에 layout.html 상속받기

1. index.html

<!DOCTYPE html>부터 </head>까지 삭제

<body>, </body>, </html> 태그 제거

<!-- C:\Code\mysite\elections\templates\elections\index.html-->


{% extends "elections/layout.html" %}

{% block title %}

선거 후보

{% endblock %}


{% block content %}


<!-- 기존 코드 유지.

    <div class = "container">로 시작하고 </table>로 끝납니다.-->


{% endblock %}


2. area.html

<!DOCTYPE html>부터 </head>까지 삭제

<body>, </body>, </html> 태그 제거

<!-- C:\Code\mysite\elections\templates\elections\area.html-->

{% extends "elections/layout.html" %}


{% block title %}

{{area}}

{% endblock %}


{% block content %}


<!-- 기존 코드 유지.

    <div class = "container">로 시작하고 </div>로 끝납니다.-->


{% endblock %}

3. result.html

<!DOCTYPE html>부터 </head>까지 삭제

<body>, </body>, </html> 태그 제거

<!-- C:\Code\mysite\elections\templates\elections\result.html-->

{% extends "elections/layout.html" %}


{% block title %}

{{area}} 여론조사 결과

{% endblock %}


{% block content %}


<!-- 기존 코드 유지.

    <div class = "container">로 시작하고 </div>로 끝납니다.-->


{% endblock %}



[네비게이션바 코드]


1. layout 추가하기

<!-- C:\Code\mysite\elections\templates\elections\layout.html -->


<!--기존 코드 -->

<body>

<nav class="navbar navbar-default">

  <div class="container-fluid">

    <div class="navbar-header">

      <a class="navbar-brand" href="{% url 'elections:home' %}">사이트명</a>

    </div>

  </div>

</nav>

<!--기존 코드 -->

2. url설정

# C:\Code\mysite\elections\urls.py

# 기존 코드 유지

app_name = 'elections'

urlpatterns = [

    url(r'^$', views.index, name = 'home')

    # 기존 코드 유지


[화일 사용하기]


1. 아이콘 적용하기

   1) static 파일은 DEBUG = true  상태에서 사용가능:C:\Code\mysite\mysite\settings.py 에서 DEBUG =true

   2) C:\Code\mysite\elections\static\elections =>favicon 그림화일 저장

   3) 경로 추가하기

<!-- C:\Code\mysite\elections\layout.html -->

{% load staticfiles %} <!-- 추가 -->


<!--기존 유지 <head> 태그 아래 코드추가>

    <link rel ="shortcut icon" type = "image/x-icon" href="{% static 'elections/favicon.ico' %}" />


[소스코드]

20170916 2 vote.zip



[참고자료]




 daviduino.co.kr

techtogetworld.com

 david201207.blog.me

cafe.naver.com/3dpservicedavid


투표관련 웹 "vote" Django WEB을 통해 장고의 기능을 확인해 가는 과정입니다.

글의 순서는 아래와 같습니다.


===========================================================================

1. 투표결과 나타내기

2. 투표기간 동적으로 표현하기

3. 지지율 동적으로 표현하기

4. 참고자료

===========================================================================



[ 투표결과 나타내기]


1. 투표결과 표현형  templates 만들기

    <!--C:\Code\mysite\elections\templates\elections\result.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">

<h1>지역구</h1>

<br>

<table class="table table-striped">

    <thead>

    <tr>

        <td><B>기간</B></td>

        <td><B>후보1</B></td>

        <td><B>후보2</B></td>        

    </tr>

    </thead>

    <tbody>

    <tr>

        <td> 기간1 </td>

        <td> 후보1 지지율</td>

        <td> 후보2 지지율</td>

    </tr>    

    <tbody>

</table>

</div>

</body>



2. URL을 투표결과로 연결하기

# C:\Code\mysite\elections\urls.py

from django.conf.urls import url

from . import views


urlpatterns = [

    url(r'^$', views.index),

    url(r'^areas/(?P<area>[가-힣]+)/$', views.areas), 

    url(r'^areas/(?P<area>[가-힣]+)/results$', views.results), 

    url(r'^polls/(?P<poll_id>\d+)/$', views.polls),

]


3. 투표후 투표결과 result위치값을 을 리턴하기/투표결과 함수를 정의하기

# C:\Code\mysite\elections\views.py


# 기존 import 유지

from django.http import HttpResponseRedirect


# def index(request) 유지


def polls(request, area):

    #...

    #return HttpResponse("finish") #여기 지우고

    return HttpResponseRedirect("/areas/{}/results".format(poll.area))



def results(request, area):

    return render(request, 'elections/result.html', )



[ 투표기간 동적으로 표현하기]


1. view.py 수정


 C:\Code\mysite\elections\views.py


def results(request, area):

    candidates = Candidate.objects.filter(area = area)

    polls = Poll.objects.filter(area = area)

    poll_results = []

    for poll in polls:

        result = {}

        result['start_date'] = poll.start_date

        result['end_date'] = poll.end_date


        poll_results.append(result)


    context = {'candidates':candidates, 'area':area,

    'poll_results' : poll_results}

    return render(request, 'elections/result.html', context)



2. view.py 수정

<html lang="en">

<head>

  <title>{{area}} 여론조사 결과</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">

<h1>{{area}}</h1>

<br>

<table class="table table-striped">

    <thead>

    <tr>

        <td><B>기간</B></td>

        {% for candidate in candidates %}

        <td><B>{{candidate.name}}</B></td>

        {% endfor %}

    </tr>

    </thead>

    <tbody>

    {% for result in poll_results %}

    <tr>

        <td> {{result.start_date.year}}/{{result.start_date.month}}/{{result.start_date.day}}~{{result.end_date.year}}/{{result.end_date.month}}/{{result.end_date.day}} </td>

        <td> 후보1 지지율</td>

        <td> 후보2 지지율</td>

    </tr>

    {% endfor %}

    <tbody>

</table>

</div>

</body>



[ 지지율 동적으로 표현하기]


1.views.py 수정


# C:\Code\mysite\elections\views.py

# 여론조사 결과보기2에 Contact모델과 이어지는 views.py


def results(request, area):

    candidates = Candidate.objects.filter(area = area)

    polls = Poll.objects.filter(area = area)

    poll_results = []

    for poll in polls:

        result = {}

        result['start_date'] = poll.start_date

        result['end_date'] = poll.end_date


        # poll.id에 해당하는 전체 투표수

        total_votes = Choice.objects.filter(poll_id = poll.id).aggregate(Sum('votes'))

        result['total_votes'] = total_votes['votes__sum']


        rates = [] #지지율

        for candidate in candidates:

            # choice가 하나도 없는 경우 - 예외처리로 0을 append

            try:

                choice = Choice.objects.get(poll = poll, candidate = candidate)

                rates.append(

                    round(choice.votes * 100 / result['total_votes'], 1)

                    )

            except :

                rates.append(0)

        result['rates'] = rates

        poll_results.append(result)


    context = {'candidates':candidates, 'area':area,

    'poll_results' : poll_results}

    return render(request, 'elections/result.html', context)


2.result.html 수정

<!-- C:\Code\mysite\elections\templates\elections\result.html -->

<!DOCTYPE html>

<html lang="en">

<head>

  <title>{{area}} 여론조사 결과</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">

<h1>{{area}}</h1>

<br>

<table class="table table-striped">

    <thead>

    <tr>

        <td><B>기간</B></td>

        {% for candidate in candidates %}

        <td><B>{{candidate.name}}</B></td>

        {% endfor %}

    </tr>

    </thead>

    <tbody>

    {% for result in poll_results %}

    <tr>

        <td> {{result.start_date.year}}/{{result.start_date.month}}/{{result.start_date.day}}~{{result.end_date.year}}/{{result.end_date.month}}/{{result.end_date.day}} </td>

        {% for rate in result.rates %}

        <td> {{rate}}%</td>

        {% endfor %}

    </tr>    

    <tbody>

    {% endfor %}

</table>

</div>

</body>




[ 참고자료]