City At Night

Django! 1. 기초 1 (제일 중요!) 본문

Django 기초

Django! 1. 기초 1 (제일 중요!)

Wuny 2020. 8. 31. 22:38
728x90
반응형

우선 파이썬으로 짠 내 코드를 웹에 표현하여 Django의 감을 잡아보자!

안녕하세요! 개발을 배우는 Wuny입니다. 제가 배운 내용을 누구나 쉽게 이해 할 수있도록 밑바닥부터 차근차근 설명해드릴겠습니다.

처음 시작하시는 분들게 적극 추천합니다!

 결과 값을 디버깅창이 아닌 HTML로 보여주기위해 장고를 사용할건데요. 장고가 설치 되어 있다는 전제하에 진행하겠습니다.

 (장고설치와 통신하는 과정 등,이론적인 부분은 따로 게시판을 만들어 설명하겠습니다! )

1. 글자수 세기 프로그램을 파이썬 코드로 짜보자

 

def counts_string(text):
    contents = len(text)
    rmcontents= len(''.join(text.split()))
    
    return contents,rmcontents

 

contents는 공백 포함 글자 수 이며, rmcontents는 공백제거한 글자 수를 보여주는 코드입니다.

 

 JavaScript를 일체 사용하지 않습니다!!(사실 사용 못함..배우면 편리한데 배워야겠습니다ㅎ)

 

  글자를 적는 Template과  글자 수를 보여주는 Template를 만들어 총 2개의 Templates을 만들었습니다.

 (여기서 Template는 HTML 문서를 말합니다!)

  한 페이지 안에서 글자를 적고 결과값이 같이 보여줄 수 있지만,

 여러분들에게 페이지간의 이동을 이해시키기 위해 두개로 나눴습니다 :)

 

 우선 간단하게 말하면

 views.py는 파이썬 함수가 들어갑니다

 urls.py는 views와 Template들을 연결 시켜줍니다.

 

2.urls작성!

 

from counterApp import views
urlpatterns = [
    path('admin/', admin.site.urls),
    path('',views.input,name='input'),
    path('result/',views.result,name='result'),
]

 

먼저 from counterApp import views 를 해주세요

(cunterApp에는 여러분의 app이름을 적으세요)

 

 첫번째 path는 기본적으로 생성되어 있는데  장고가 기본적으로 제공하는 관리자 권한으로 관리할 수 있는 곳 입니다.

  (나중에 알게 될꺼에요)

 

 두번째, 세번째 path를 파헤쳐 봅시다!!

 

                       path( '', views.input, name='input' )

 

 자, '' 이건 url주소를 뜻해요 아무것도 없으니 '' 이걸로 표현한건데요. 기본적으로 홈페이지를 접속했을때 처음으로 뜨  는  그 주소를 말합니다.

 

                       (ex. wuny.com)

 

그렇다면 그 아래 path의 'result'는??! 

 

네 맞습니다! (wuny.com/result) 가 되는거죠!

 

그럼 두번째 인자값 views.input 은 뭘까요? 

위에서 views.py는 파이썬 함수가 들어간다고 했죠?

 

'views.py의 input함수를 사용할거야'라고 장고에게 말하는 겁니다.

 

그럼 세번째 인자값 name="input"은 '이 path를 input이라고 할꺼야'라고 장고에게 말해주는 거예요.

생략 가능하답니다!

 

3.views.py 작성

 urls작성에서 두번째 파라미터값(인자)으로 views.input 과 views.result를 적어줬죠?

그러니 input함수와 result함수를 작성해 봅시다.

 

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

def result(request):
    contents = len(request.POST["textarea"])
    rmcontents = len("".join( request.POST["textarea"].split() ))
    return render(request, 'result.html', {"contents_num" : contents, "del_contents" : rmcontents})

 

input함수는 간단하죠? 그 이유는 html에서 form에서 입력을 받아서 result함수로 넘겨주기 때문에 별 다른 기능이 없어요. 

 자, 그럼 또 분석 해봅시다..

 

  return render(request,'input.html')는

'사용자 요청이 들어오면 input.html을 너한테 보여주겠어!' 라고 해석하심 됩니다

 

 다음 result함수를 봅시다 ..

 뭐..뭐지?..어디서 많이 본 코드인데?..

 네 맞습니다 여러분이 위에서 작성한 글자수 세기 코드와 비슷하죠. 

위에서 짠 코드를 HTML에서 잘 동작하도록 수정했습니다.

 

처음보는 코드들만 해석해드리면 request.POST["textarea"]는  textarea라는 name의 POST요청을 보낸겁니다.

여기에 바로 저희가 글을 적은 데이터가 들어오게 된거죠.

 

 그 데이터를 len 함수를 써서 문자열 길이를 계산하는거구요.

 

 그 다음 줄은 기본적 함수내용이니 생략하겠습니다!

 

자 마지막줄 return값에 3번째 파라미터값으로 dictionary값이 들어갔는데요.

 

간단히 말하면 파이썬의 key값을 가지고 html에서 쓸 수 있다는 점!! 꼭 기억해두세요!

 

총 글자수를 표현하는 contents와 공백을 제거한 rmcontents를 html에 뿌려주기 위해 딕셔너리 형태로 저장해놓은거죠!

 

자 이제 마지막 Templates 작성을 해봅시다

 

4.Templates 작성!!

  • 글자를 적는 input.html 입니다.
<body>
<div class="mother">
    <div class="box1"></div>
        <h1>글자 수 세기</h1>
        <form action="{% url 'result'%}" method ="POST"> 
            {% csrf_token %}
            <textarea name="textarea"  cols="50" rows="30"></textarea>
            <br/>
            <button type="submit" class="chbox_char">글자 수 확인하기</button>
        </form>
    </div>
</div>
</body>

 

장고 문법이 사용됐네요. 

{% %}로 감싸져 있는 코드가 바로 장고 문법입니다. 파이썬 코드와 매우 유사합니다.

장고 문법만 다룰게요! HTML은 다들 잘 아시죠?

     

          form action="{% url 'result' %}" method="POST"  

    result url로 POST 요청을 보내겠다라고 해석하시면 됩니다! 

    ( POST? 장고 이론편을 확인해주세요)

 

          {% csrf_token %}

          cross site request forgery의 약자로  공격자가 CRUD를 하는 행위입니다

          원래는 개발자가 보안요소까지 고려하여야하지만 친절한 장고씨는 이러한 모듈을 제공해주네요

          자세한 내용은 다루지 않겠습니다.

 

 

  • 글자 수를 보여주는 result.html입니다

 

<body>
    <h1>글자 수 : {{contents_num}} </h1>
    <h1>공백 제거 : {{del_contents}} </h1>
</body>

 

간단하죠?  장고문법이 또 사용 되었네요 

{{ }} 중괄호 두개로 감싸져 있으면 파이썬에서 사용한 변수명을 사용할 수 있답니다.

 

{%%}와 {{}}의 차이를 아시겠나요?

 

{%%}는 음... 조건문 반복문 등 문법을 사용할때 주로 쓰이고 {{}}는 변수명을 가져올때 사용한다고 기억해주세요.

 

자 이제 끝입니다.

 

요약을 하면

 

html에서 views.py가 돌아가고 html와 views.py의 함수를 연결하기 위해 urls를 작성한다!

 

더 정확히 말하면 ↓

 

 1. 클라이언트가 서버에게 '나 글자수 세기 프로그램 보여줘' 라고 요청

 

 2. 서버는 urls.py를 뒤적거리며 글자수 세기가 있는지 확인하고

 

 3. urls에서 views.py를 호출하고 views.py는 그에 맞는 응답을 함! (templates 또는 다른 응답)

 

이젠 다음 포스터부터는 게시판을 만들어 보며 더 공부를 해봅시다

728x90
반응형
저작자표시 변경금지

'Django 기초' 카테고리의 다른 글

Django! 5. 게시물을 작성하자 CREAT(2)  (0) 2020.09.09
Django! 4. 게시물을 읽어보자! READ(2)  (0) 2020.09.09
Django! 3. 게시물을 읽어보자! READ(1)  (0) 2020.09.09
Django! 2. 게시물을 작성하자.CREATE(1)  (0) 2020.09.08
'Django 기초' Related Articles more
Comments