728x90
LikeLion 수업에서 django 강의를 맡았는데, 저번 기수에서 했던 wordcount 와 제비 뽑기를 추가하여
수업을 진행하려고 한다. 수업을 준비하다보면 공부도 많이 되는 것 같다.
html 코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="{%url 'home'%}">Wordcount</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="{%url 'home'%}">main<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active">
<a class="nav-link" href="{%url 'about'%}">about</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{%url 'lots'%}">Lots</a>
</li>
</ul>
</div>
</nav>
<br>
{%block content%}
{%endblock%}
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous">
</script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous">
</script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous">
</script>
</body>
</html>
저번 기수에는 엄청 못생긴 페이지로 진행을 했던데, 나는 그냥 부트스트랩을 어떻게 쓰는지 알려줄 겸 해서
navbar 를 삽입했다. 그리고, 템플릿 상속을 하지 않으면 일일이 복붙 ㅠ 해야하고 한 가지가 바뀌면
모든 html 파일을 수정해야 하기 때문에, 템플릿 상속도 알려주면서 수업을 진행하려 한다 !
{% extends 'base.html' %}
{%block content%}
<div class="form-group text-center">
<label for="exampleFormControlTextarea1">WORD COUNT</label>
<form action="{%url 'count'%}"> <textarea class="form-control mx-auto" id="exampleFormControlTextarea1" rows="3"
style="width: 400px" name="fulltext"></textarea>
<br>
<input class="btn btn-dark" type="submit" value="전송!">
</form>
</div>
</form> {%endblock%}
입력 창 이 있고, 전송 버튼을 눌러 단어 빈도수를 셀 것이다.
{% extends 'base.html' %}
{%block content%}
<div class="card mx-auto border-dark" style="width: 50rem; height: 600px">
<div class="card-body text-center">
<h1 class="card-title">입력한 문장 </h1> <BR>
<p class="card-text">
{{fulltext}}</p>
<h1 class="card-title">단어 개수 </h1> <BR>
<p class="card-text">
<h3> {{word_list}}개</h3>
</p>
<h1 class="card-title">단어 빈도수</h1> <BR>
<p class="card-text">
{%for word, count in dictionary%}
{{word}} - {{count}}
<br>
{%endfor%}
</p>
</div>
</div>
{%endblock%}
결과를 나오게 하는 html 파일. {% %} 는 django 문법을 사용한 것이고, {{ }} 는 데이터를 화면에 출력하고 싶을때 사용하는 것이다.
views.py
from django.shortcuts import render
import random
# Create your views here.
def home(request):
return render(request,'home.html')
def about(request):
return render(request,'about.html')
def count(request):
full_text = request.GET['fulltext']
word_list = []
word_list = full_text.split()
word_dictionary = {}
for word in word_list:
if word in word_dictionary:
word_dictionary[word] += 1
else:
word_dictionary[word] = 1
return render(request,'count.html',{'fulltext' : full_text, 'word_list' : len(word_list),'dictionary' : word_dictionary.items()},)
def lots(request):
return render(request,'lots.html')
def lots_result(request):
full_text = request.GET['fulltext']
peoples = []
peoples = full_text.split()
return render(request,'lots_result.html',{'fulltext' : full_text,'random' : random.choice(peoples)})
html 파일에서 넘어온 데이터를 처리하는 과정이다.
제비 뽑기와 단어 빈도수를 세는 방식이 거의 동일한데,
단어 빈도수는 단어를 공백을 단위로 자른다음, dictionary 에 넣어
그 단어가 KEY에 있다면 +1 없다면 1로 초기화 하는 방식이고,
제비뽑기도 공백을 단위로 자르고, 리스트에 넣어
random 의 choice 메소드를 이용해 랜덤으로 하나를 뽑게 했다.
아주 간단한 django 예제이다 !
'개인공부 > Django' 카테고리의 다른 글
가상환경을 사용하는 이유 (0) | 2020.07.13 |
---|---|
DJANGO - MTV Pattern (0) | 2020.07.13 |
DJANGO 개요 , 특징 (0) | 2020.07.13 |