Python,Django

[Django] 워드카운트 만들기

뀨린 2021. 5. 6. 01:18

들어가기 (vscode의 터미널)

 

프로젝트 이름은 자유롭게 바꿔보세요!

$ python –m venv myvenv
 myvenv라는 가상환경을 만들어줍니다.

$ source myvenv/scripts/activate
 myvenv 가상환경을 켜주도록 할게요!

$ pip install django
 django 설치

$ django-admin startproject firstproject
 헷갈리지 않도록 상위 폴더 이름을 바꿉니다. 

$ cd djangoproject
폴더 안으로 들어가는 명령어 ‘cd’를 써서 djangoproject 안으로 들어갑니다.

app 만들기

 

$ python manage.py startapp wordcount // wordcount라는 앱이름 만들기

 

settings.py를 찾아서 내부에 있는 installed apps = [ ] 안에

 

'wordcount.apps.WordcountConfig', 입력한다. ( ","를 잊지 마세요! 에러가 많이 나는 부분입니다.)

 

Config앞의 app이름은 대문자로 해아한다.

 

home.html

 

wordcount 폴더(앱 폴더)안에 > templates 폴더를 만든다. app의 기능이 구현되는 것을 사용자에게 보이려면 화면 만들어야 한다! 사용자에게 보이는 화면은? html! app의 화면(html)이 들어갈 폴더를 새로 만들어야 한다. 

 

Templates 폴더 >오른쪽 버튼 클릭 후, home.html을 만든다. 

 

home.html

 

<h1> 글자 세는 홈</h1>

Views.py

 

view에서는 ‘이런 상황에서 어떻게 해라!’ 하는 함수를 정의해주는 곳이다. home이라는 함수의 request가 들어오면 home.html을 반환하도록 정의한다. (def 뒤의 home이 함수의 이름) render가 받는 인자는 (request, '템플릿 이름', 사전형 객체(dictionary형 자료형))

 

def home(request):
	return render(request, 'home.html')

urls.py 

 

views.py에서 ‘request가 들어오면 어떤 행동을 해라’를 정하고, urls.py에서 request를 정의한다.

'', wordcount.views.home, name="home" 는 순서대로 가장 기본 페이지일 때(request)wordcount 내에 views.py 에 있는 home 함수를 구현할 건데, 행동 방식(path)의 이름을 home이라고 할게! 라고 명령한다. 

 

import wordcount.views   //wordcount 내에 views.py를 가져오라는 것

path('', wordcount.views.home, name="home"),  //urls.py >> urlpatterns 아래에, 

 

다양한 html 다루기

 

home.html

임의로 만든 home.html 파일에 다시 들어가서 아래와 같이 수정해보겠다.

 

<h1>글자세는 홈 </h1> 
<a href="">ABOUT</a>
<form action="">
<textarea cols="40" rows="10" name="fulltext"></textarea>   //40X10짜리 텍스트 입력창
<br>
<input type="submit" value="Count">
</form>

about.html

 

Templates 폴더에 about.html 생성한다. 

 

이렇게 아무 문구나 작성해주시고, a태그 통해 home으로 돌아갈 수 있도록 합니다. 아직 “” 내에 경로는 작성하지 않았습니다.

<h1> 푸린푸푸푸린 푸린 </h1>
<br>
<a href=""> home으로 돌아가기</a>

Views.py

 

  about이라는 이름의 함수 생성한다. 이를 통해 request가 들어오면 about.html을 반환하도록 한다.

def home(request):
	return render(request, 'home.html')
    
    
    
def about(request):
	return render(request, 'about.html’)

urls.py

 

urlpatterns 아래에 이어서 작성해주면된다.  ~~~/about이라는 url일 때에 about 함수를 구현하고 그런 방법의 이름을 about이라고 짓겠다.

path('', wordcount.views.home, name="home"),
path('about/', wordcount.views.about, name="about"),

 

Home.html

 

about 함수에 대한 url을 지정한 후에야 비로소 a 태그에 어디로 가야할지를 알려줄 수 있다. {% %}는 파이썬 언어를 html이 못 알아먹기 때문에 Django에서 특별하게 사용하는 문법입니다. {%url ‘path 이름(urls.py에서 설정한)’%}을 통해 urlhtml에 넣을 수 있다

<h1>글자를 세는 홈 </h1> 
<a href="{%url ‘about’%}">ABOUT</a>
<form action="">
<textarea cols="40" rows="10" name="fulltext"></textarea>
<br>
<input type="submit" value="Count!">
</form>

 

about.html

 

about 페이지에서도 home으로 돌아가는 링크를 만들기 위에서 배운 {% url %}을 통해 homeurlhtml에게 알려주자!

<h1> 푸린푸푸푸린 푸린 </h1>
<br>
<a href="{% url 'home' %}"> home으로 돌아가기</a>

result.html 

 

result.html을 완성하고 단어를 세는 함수를 다루어보자. 

 

<h1>당신이 입력한 텍스트는 <!-- 총 단어 -->구성되어 있습니다. </h1>
<a href="{%url 'home'%}"> 다시 하기 </a>
<br>
<h2> 입력한 텍스트 : </h2>
<!--입력받은 전체 텍스트-->
<h2> 단어 카운트 : </h2>
<!--'단어' - '단어가 나온 횟수' -->

views.py

 

Views에서 result 함수 만들기

def home(request):
	return render(request, 'home.html')
    
def about(request):
	return render(request, 'about.html')
    
def result(request)
	return render(request, 'result.html')

urls.py

 

result에 대한 url도 만들어줍시다. 

path('', wordcount.views.home, name="home"),
path('about/', wordcount.views.about, name="about"),
path('result/', wordcount.views.result, name="result"),

home.html 

 

result에 대한 url도 만들어주었으니 제출 버튼을 누르면 result.html로 이동할 수 있도록 url을 넣습니다. 

<h1>글자를 세는 홈</h1> 
<a href="{%url ‘about’%}">ABOUT</a>
<form action="{%url 'result'%}"> //result.html로 가는 url
<textarea cols="40" rows="10" name="fulltext"></textarea>
<br>
<input type="submit" value="Count">
</form>

Views.py

 

사용자가 입력한 문자 데이터를 받아온다. 받아올 데이터가 있는 textarea의 이름:  fulltext이므로, request.Get[‘textarea의 이름’]의 형식을 통해 데이터를 받아온다. 받아온 문자열을 다른 함수나 html에서도 사용하려면 다른 변수에 담아야 한다! 이 변수를 text라고 이름 임의로 짓는다. result 함수내에 render의 세 번째 인자는 사전형 객체이다. 

 

 > > fulltext 안의 원문을 get을 통해 받아온 후, 그를 text라는 변수에 담는 것

 

def home(request):
	return render(request, 'home.html')
    
def about(request):
	return render(request, 'about.html')
    
def result(request):
	text = request.GET['fulltext']
	return render(request, 'result.html', {'full' : text})

result.html

 

html에 파이썬 변수의 key값을 쓰려면 {{변수명}}으로 한다. 우리가 text라는 valuekeyfull로 지정했는데 입력한 텍스트라는 문구 밑에 원문을 보여주기 위해서 key값을 넣어준다. 그러면 그 value값으로 들어있는 원문이 등장한다.

<h1>당신이 입력한 텍스트는 <!-- 총 단어 -->구성되어 있습니다. </h1>
<a href="{% url 'home' %}"> 다시 하기 </a>
<br>
<h2> 입력한 텍스트 : </h2>
{{full}} //{{변수명}}
<h2> 단어 카운트 : </h2>
<!--'단어' - '단어가 나온 횟수' -->

views.py

 


 변수명.split은 원문을 공백 단위로 잘라주는 함수이다. 이렇게 자른 단어의 리스트를 words라는 변수(박스) 안에 모아둔다.그리고 또, 다시 한 번 딕셔너리형 자료형을 사용해준다. len(변수명)은 변수가 가진 리스트의 길이(단어의 수)나타내준다 👉 그 길이를 value, key 값은 total로!

def home(request):
	return render(request, 'home.html')
    
def about(request):
	return render(request, 'about.html')
    
def result(request):
	text = request.GET['fulltext']
	words = text.split()
	return render(request, 'result.html', {'full' : text}, {'total' : len(words)})

result.html

 

views.py에서 단어 수 len(word)key값으로 total을 뒀다. 파이썬 언어를 통해 이 key값을 html넣어준다. 그러면 value값이었던 리스트의 길이가 등장한다. 

<h1>당신이 입력한 텍스트는 {{total}} 구성되어 있습니다. </h1>
<a href="{% url 'home' %}"> 다시 하기 </a>
<br>
<h2> 입력한 텍스트 : </h2>
{{full}}
<h2> 단어 카운트 : </h2>
<!--'단어' - '단어가 나온 횟수' -->

단어 횟수를 세보자!

 

<사전형 자료형>에서 단어 횟수를 어떻게 세나요?

 

✨크게 빈 사전을 두고 그 안에 단어와 횟수를 담는다. 

 

처음 보는 단어가 나오면 그 단어에 1 부여한다. 그 단어가 한 번 더 나올 때마다 1을 추가하는 식으로 단어 횟수를 센다. 처음 보는 단어는 1, 또 나오면 +1

 

  • 빈 사전 = {:+1} (1씩 추가되는 것)

 

👉 단어 수를 카운트 하는 것은 순차적으로!

 

textarea에 넣을 text가 다음과 같다면

 

나의 이름은 푸린 나의 나이는 스물두살

‘나의 이름은 푸린 나의 나이는 스물두살’

 

text.split()을 통해 자른 모습은 다음과 같다. 

 

나의

이름은

푸린

나의

나이는

스물두살

 

Views.py

 

단어:횟수 쌍을 담을 word_dictionary라는 변수(빈 사전)를 먼저 만들어 준다. 그리고 나서 for문을 이용하여 각각의 단어에 대해 횟수 세기를 해준다. 

 

for word(for문에서의 사용을 위한 새로운 변수) in words(우리가 앞서 text.split()을 할 때 지정한 변수)을 먼저 써주고, word가 기존에 있었다면 1을 더하고 그렇지 않고 새로운 것이라면 1값을 부여하는 프로세스를 작성해준다. 이때 word_dictionary[word]안에 word에 원문에 있는 여러 가지 단어들이 각각 들어간다.

 

       예) 나의 이름은 푸린 나의 나이는스물두살

 

def result(request):

	text = request.GET['fulltext']
	words = text.split()
	word_dictionary = {}
	for word in words
		if word in word_dictionary:
		#increase
		word_dictionary[word]+=1
		else:
		# add to dictionary
		word_dictionary[word]=1
	return render(request, 'result.html', {'full' : text}, 
	{'total' : len(words)}, {'dictionary' : word_dictionary.items()})

 

앞선 예문에서 처음으로 들어갈 단어는 ‘나의’일것이다. ‘나의’가 처음 나와 1이라는 값을 갖게 되고, 두 번째로 [word]에 ‘이름은’이 들어갈 것입니다. 계속 진행하다가 [word]에 ‘나의’이 한 번 더 등장하면 그 때 +=1의 코드가 사용된다

그 후 ‘단어:횟수’ 쌍을 처리하기 위해서 쌍을 처리하는 함수 .items를 이용하여 word_dictionary.items()value값으로, dictionarykey값으로 하는 딕셔너리 자료형을 만들어준다.

 

result.html

 

단어 카운트 밑에 우리 만들었던 딕셔너리 자료형의 key값인 dictionary를 적어서 word_dictionary.itmes()의 쌍들이 나오게 해준다.

 

<h1>당신이 입력한 텍스트는 {{total}} 구성되어 있습니다. </h1>
<a href="{% url 'home' %}"> 다시 하기 </a>
<br>
<h2> 입력한 텍스트 : </h2>
{{full}}
<h2> 단어 카운트 : </h2>
{{dictionary}}

진짜 마무리!!!

 

서버를 돌려볼까요?

$ python manage.py rusnerver

모양을 보면...

 

{나의 : 2, 이름은 : 1, 푸린이야, : 1,

 나이는:1, 스물두살이야.:1}

 

result.html

 

dictionary 내에 단어, 횟수로 변수가 2개니까 단어에 word, 횟수에 howmany라는 2개의 변수를 부여한다.

그리고 {{word}}:{{howmany}}를 통해 {{단어}}:{{횟수}} 형태로 나올 수 있도록 해주고, <br>을 통해 한 줄 띄어준다(보기좋게하기 위함). 그리고 나서는 for문을 endfor를 통해 닫아준다. (for를 템플릿 언어의 태그로 사용하실 때는 항상 닫는 태그를 해줘야 합니다!) 그러면 각각의 쌍에 대해 줄바꿈이 적용되어 예쁜 모양으로 완성✨

<h1>당신이 입력한 텍스트는 {{total}} 구성되어 있습니다. </h1>
<a href="{% url 'home' %}"> 다시 하기 </a>
<br>
<h2> 입력한 텍스트 : </h2>
{{full}}
<h2> 단어 카운트 : </h2>
{%for word, howmany in dictionary%}
{{word}} : {{howmany}}
</br>
{{%endfor%}}

 

Django 처음 공부할 때, mtv 패턴 익히는데 워드카운트 만드는 실습이 정말 도움이 많이 됐었다! 프로젝트 여러번 만들어보면 mtv 패턴을 금방 익히긴 하지만 혼자 하루만에 속성으로 익히기에 제일 좋은 실습인 것 같다 🙌 변수명도 바꾸고, 이거저거 바꿔보면서 공부해보는 것을 추천한다! 이 글에는 기본 html틀만 잡혀있지만, 이 뼈대 위에 css도 입혀보고 Bootstrap도 사용해보면서 본인 개성에 맞게 바꿔보자! 

'Python,Django' 카테고리의 다른 글

MTV 패턴  (0) 2021.05.06