SlideShare a Scribd company logo
1 of 27
Download to read offline
1. Django Essentials
자, 이제부터 본격적으로 Django를 이용해 개발해 볼 시간입니다. 하지만 언제나 개발 환경을 먼
저 생각하셔야합니다. 항상 먼저 실행할 것은 개발할 가상 환경에 접속하는 것입니다.
$ workon studybee
1.1 Where is Django?
[Figure 1. Django 경로]
1) Django 경로
~/.virtualenvs/studybee/local/lib/python2.7/site-packages/django
우리는 현재 virtualenv를 통해 만든 가상 환경에 들어가서 Django를 설치하였습니다. 따라서
Django가 어딨는지 확인해보려면 가상 환경이 저장된 곳 안으로 먼저 들어가야 합니다.
우리는 가상 환경이 저장될 곳을 ~/.virtualenvs 로 지정했고 저는 studybee 라는 이름으로
가상환경을 만들었기 때문에 경로가 ~/.virtualenvs/studybee 로 시작하는 것입니다.
2) Django 경로를 알아야 하는 이유
Django는 다른 개발자에 의해 만들어진 기능의 집합이며 오픈 소스입니다. 즉, 어떤 기능이 어떻
게 동작되는지 알기 위해선 첫 번째로 공식 문서를 봐야합니다. 두 번째로는 직접 해당 소스를 보
는 것입니다. 다른 훌륭한 개발자가 만든 것이기 때문에 어떻게 프로그래밍하는지 습득할 수도 있
어 일거양득입니다.
1.2 Structure of Django
1) 구조
[Figure 2. Django 구조(Project와 App)]
Django의 전체적인 구조는 위와 같이 생겼습니다. 최상단에 Project가 있고 아래에 시작 패키지
디렉토리와 App이 있습니다. 그리고 그 App안에는 MTV 패턴을 따르는 파일이 존재합니다.
1. Project
1. 시작 패키지: Project의 전반적인 환경을 설정할 수 있습니다.
1. __init__.py: 이 디렉토리를 파이썬 패키지로 만들어 줍니다.
2. settings.py: Django 프로젝트를 설정합니다. Database 등을 설정할 수 있습
니다.
3. urls.py: URL 주소와 Django의 기능(함수)을 연결시켜줍니다.
2. 앱(app)
1. __init__.py: 이 디렉토리를 파이썬 패키지로 만들어 줍니다.
2. admin.py: 관리자 항목을 설정할 수 있습니다.
3. models.py: 데이터베이스 구조를 만드는 파일입니다.
4. urls.py: 앱과 관련된 URL 주소와 Django의 기능(함수)을 연결시켜줍니다.
5. views.py: 판다로의 상자처럼 무언가 행동을 하는 부분입니다.
3. manage.py: 프로젝트를 관리하는 파일입니다. Web server 구동 등의 기능이 있습
니다.
2) Project 생성
Django의 첫 번쨰는 Project를 만드는 것입니다. 각자의 작업 폴더에 들어가서 아래와 같이 실행
해 보겠습니다. 예를 들면 가상 머신과의 공유 폴더인 ~/Code/ 에 가서 아래와 같이 실행합니다.
$ django-admin.py startproject studybee
위와 같이 실행하면 Django가 자동으로 studybee 라는 프로젝트명으로 필요한 폴더와 파일을
생성해줍니다. 만약 위와 같이 실행하지 않는다면 수작업으로 일일이 폴더를 만들고 파일을 만들
어주면 됩니다. 하지만 귀찮지요? 그래서 Django에서는 위와 같은 명령어를 제공해주는 것입니
다.
[Figure 3. Project 생성 후 폴더와 파일]
Project를 생성하면 위와 같은 그림이 나옵니다. 즉 manage.py 파일과 studybee 라는 시작 패
키지 폴더를 볼 수 있으며 시작 패키지 안에 들어가면 4개의 파일이 자동으로 생성되어 있음을 볼
수 있습니다.
+ 만약에 Project를 지우고 싶다면?
Django는 쉽게 Project에 필요한 파일과 폴더를 만들어줄 뿐입니다. 응용 프로그램이 아니지요.
그래서 생성한 Project를 지우기만 하면 됩니다. 아래처럼요.
$ rm -rf studybee
3) App 생성
Django의 두 번째는 Project 내에 App을 만드는 것입니다. Project 내로 이동해서 아래와 같이 실
행합니다.
$ django-admin.py startapp qna
위와 같이 실행하면 Django는 qna app에 필요한 폴더와 파일을 생성해줍니다. 위와 같은 명령어
를 실행하고 싶지 않다면 손수 폴더와 파일을 만들어주면 됩니다. 하지만 귀찮지요?! 그래서
Django는 위 명령어를 제공하는 것입니다.
[Figure 4. App 생성 이 후 폴더와 파일]
App을 생성하고 나면 위와 같은 화면이 나옵니다. qna 라는 폴더가 생기고 이 안을 보면 5개의 파
일과 1개의 폴더가 자동으로 생성되어 있는 것을 확인할 수 있습니다.
1.3 MTV Pattern
위에서 Django의 기본 구조인 Project와 App을 알아봤습니다. 이제는 소프트웨어 공학적인 측면
의 개발 방법론인 MTV Pattern을 알아보겠습니다.
[Figure 5. Django의 Project 구조와 MTV Pattern]
위에서 보는 것과 같이 지금까지 우리는 Project를 만들고 그 안에 App을 만들었습니다. 그리고 이
Project에 MTV에 해당하는 파일을 작성하는 것을 MTV Pattern으로 개발한다고 합니다.
그런데 이 MTV Pattern을 이용해 Web application을 만들면 어떻게 작동하는지 아래 그림으로 알
아보도록 하겠습니다.
[Figure 6. MTV 작동 원리 ]
이 동작 원리가 상당히 중요합니다. 이 것만 잘 이해하고 넘어가면 Django의 첫 문턱은 무사히 넘
어간 거나 다름없습니다.
1
MTV를 이용한 요청/응답 프로세스
1. 먼저 사용자가 브라우저를 이용해 특정 페이지에 접근합니다. (요청)
2. 이 때 Django는 Urls를 통해 사용자가 접속한 URL에 해당하는 Views안의 함수를 연결해 줍
니다.
3. Django의 Views는 필요한 경우 데이터를 가져오기 위해 Models를 통해 Database에 접근
합니다.
4. Views는 가져온 데이터를 처리한 결과물을
1. 바로 사용자의 브라우저에 보여줍니다. (응답)
2. Templates를 통해 사용자의 브라우저에 보여줍니다. (응답)
이 구조가 바로 MTV입니다. 하나의 파일로 처리할 수도 있지만 이렇게 논리구조를 나누어 개발할
때 편의성을 제공하는 것입니다. 그래서 이것을 소프트웨어 공학적 개발 방법론 이라고도 합니다.
[Figure 7. MTV 작동 원리]
위에서 설명한 것을 조금 더 구체적으로 그려보면 위 그림과 같습니다. 초록색 박스는 부가적인 것
이기 때문에 지금은 보지 않아도 괜찮습니다.
번호가 매겨진 순서대로 작동합니다. 즉 사용자의 요청과 응답에 대한 프로세스인 것입니다. 이 흐
름을 잘 익혀두어야 합니다. 가장 기본이기 때문입니다.
이제는 위 구조를 가지고 간단한 웹 어플리케이션을 만들어 보겠습니다.
1.4 Hello, World! App
Django를 이용해 웹 브라우저 화면에 Hello, World!를 출력하는 웹 어플리케이션을 만들어 보겠습
니다.
1. helloworld라는 Project 생성
$ django-admin.py startproject helloworld
2. say라는 App 생성
위에서 만든 Project 폴더에 들어가 아래와 같이 실행합니다.
$ django-admin.py startapp say
3. Project 세팅
이제 본격적으로 작성해보겠습니다. 개발할 때는 유료같은 무료 에디터인 Sublime Text 3을 추천
합니다.. 먼저 세팅을 하겠습니다. App을 생성했으면 항상 Project 세팅 파일의 내용을 변경해야
합니다. 에디터를 이용해 Project의 세팅값이 들어가 있는 시작 패키지 내 settings.py 을 오픈
합니다.
이미 여러가지 내용이 들어가 있을 것입니다. Project 생성 시 기본적으로 Django가 넣어준 내용
입니다. 여기에서 INSTALLED_APPS 를 찾아 위에서 만든 App을 등록해줍니다. 다 등록을 하면
아래와 같이 됩니다.
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'say',
)
이미 설치된 App이 많이 있음을 알 수 있습니다. INSTALLED_APPS 라는 객체의 형태는 튜플입니
다. 여기에 우리가 만든 say 라는 이름의 App을 추가해준 것 뿐입니다.
4. 잘 작동되는지 확인
이제 helloworld 라는 웹 어플리케이션이 작동할 준비가 다 되었습니다. 본격적으로 Hello
World!를 보여주기 전에 잘 작동하는지 확인해보겠습니다. 아래와 같이 실행합니다.
1) 웹서버 구동
$ python manage.py runserver 192.168.10.10:8000
Django는 이미 작고 가벼운 웹서버를 내장하고 있습니다. 개발 시에는 빠르게 개발할 필요가 있기
때문에 Django도 기본으로 작고 가벼운 웹서버를 제공해주고 있는 것입니다. 이 웹서버를 이용해
웹서버를 실행시키는데 IP 주소와 포트 번호를 옆에 입력해 줍니다.
2) 웹 브라우저로 접속
이제 각자의 로컬 컴퓨터에서 브라우저를 실행해 192.168.10.10:8000 을 입력해 접속해보겠
습니다. 정상적이라면 아래오 같은 화면이 나올 것입니다.
[Figure 8. 정상적으로 세팅했을 때 나오는 첫 화면]
5. URL 등록
정상적으로 작동하는 것을 확인했으면 이제 본론으로 돌아가서 Hello, World!를 화면에 출력하는
것을 계속해서 만들어 보겠습니다. 처음에 URL 부터 등록해 보겠습니다. 개발 순서는 상관없습니
다다. 그런데 왜 URL부터 등록을 하려고 할까요?
1) MTV의 프로세스를 다시 생각해봅시다.
[Figure 9. Django MTV 프로세스]
Django는 모든 파일을 URL로 설계해서 접근해야 합니다. 사진, 음악파일, html파일, Javascript
파일 등 어떠한 것도 예외가 없습니다. urls.py는 사용자가 어떤 경로로 접근을 했는지 파악해서
해당 기능(혹은 파일)으로 이어주는 역할을 합니다.
그런데 여기서 중요한 것은 프로세스입니다. 즉 위와 같이 Django의 MTV 프로세스를 생각해보면
사용자가 웹 브라우저로 접속했을 경우, 처음으로 대응하는 것은 바로 Django project의 시작 패
키지 안에 있는 urls.py입니다.
2) urls.py 작성
순서는 상관없지만 여기서는 위 프로세스 대로 작성해보겠습니다. 에디터로 Project 안에 있는 시
작 패키지 디렉토리의 urls.py파일을 열어 아래와 같이 작성합니다.
[Figure 10. helloworld 프로젝트 > 시작 패키지 > urls.py]
시작 패키지 안에 있는 urls.py를 작성한 화면입니다.
3) urlpatterns
urlpatterns = patterns('',
url(r'^admin/', include(admin.site.urls)),
url(r'^$', 'say.views.sayhello'),
)
위 코드를 보면 urlpatterns 라는 변수에 특정값을 할당해주고 있습니다. 이 변수를 통해서
Django는 URL 주소를 인식하는 것입니다. 이 변수의 데이터 타입은 list입니다.
4) patterns 함수
urlpatterns라는 변수에는 patterns라는 함수를 사용하여 특정값을 넣어주고 있습니다. 그리고
해당 함수에 들어가는 인자값 첫 번째는 '' (빈 값)만 들어가 있고, 두 번째부터는 url함수를 이용
해서 사용자가 접속한 URL주소를 파악하고 있습니다.
2
urlpatterns라는 변수에는 항상 patterns라는 함수를 사용합니다. 이는 공식문서를 통해서 자세
한 내용을 확인할 수 있습니다.
5) url 함수
url함수를 통해서 사용자가 요청한 URL 주소를 확인하고 해당 주소에 맞는 함수로 이동시킵니다.
그래서 이 함수의 첫 번째 값은 URL 주소이고 두 번째 인자값은 이동할 함수로 구성되어 있습니다.
공식문서를 통해서 자세한 내용을 확인할 수 있습니다.
+ URL주소 - Regular Expression
url함수의 첫 번째 인자값으로 r'^$' 라는 이상한 값이 들어가 있습니다. 이는 Regular
Expression이라고 하는 것인데, 사용자가 어떤 값을 입력했는지 파악하는데 사용합니다. ^(Caret)
은 시작을 의미하고 $은 끝을 의미합니다. 즉 r'^$' 의 의미는 사용자가 아무것도 입력하지 않고
접속했을 때를 의미합니다.
Regular Expression은 어려운 내용입니다. 이는 차차 하나씩 배워보는 것으로 하겠습니다.
+ 이동할 함수
say.views.sayhello 라고 적었습니다. 이는 say 라는 App 안에 있는 views 모듈 안에 있는
sayhello 라는 함수를 실행하라는 의미입니다.
6. Views
우리가 위에서 설정한 sayhello 라는 함수를 드디어 작성할 때입니다. 아래와 같이 작성합니다.
from django.http import HttpResponse
def sayhello(request):
return HttpResponse('<h1>Hello, World!</h1>')
1) fromdjango.http import HttpResponse
Django에서 기본적으로 제공해주는 HttpResponse 클래스를 사용하겠다는 뜻입니다. 그런데 그
클래스는 django라는 패키지안의 http라는 모듈안에 있습니다. 이 클래스는 사용자에게 보여주
길 원하는 내용을 Http라는 프로토콜을 이용해 보여주는 기능을 합니다.
이는 공식문서에서 확인할 수 있습니다.
2
2) sayhello 함수
+ request
def sayhello(request):
웹 어플리케이션은 항상 request 객체를 갖고 돌아다닙니다. 그렇기 때문에 urls.py를 이용해 실
행되는 sayhello라는 함수의 인자값으로 request라는 객체를 넣어준 것입니다. 넣어주지 않으면
에러가 나니 꼭 써야합니다.
+ return
def sayhello(request):
return HttpResponse('<h1>Hello, World!</h1>')
urls.py를 통해 sayhello 함수를 호출하였기 때문에 이 호출에 대해 반응을 해줄 필요가 있습니다.
여기서는 함수의 return으로 특정값을 반환해주고 있습니다. 그런데 그 값이 <h1>Hello,
World!</h1> 라는 인자값을 갖고 HttpResponse 클래스를 통해서 만들어진 내용입니다.
7. 웹서버 구동 및 확인
자, 이제 다 되었습니다. 이제는 웹서버를 구동하여 확인해보도록 하겠습니다. 가상 환경에서 아
래와 같이 입력하여 웹서버를 실행합니다.
$ python manage.py runserver 192.168.10.10:8000
그리고 로컬 컴퓨터의 웹브라우저를 통해 192.168.10.10:8000 를 입력해 접속해봅니다. 아래
와 같이 나오면 성공한 것입니다.
[Figure 11. Hello, World! 정상 작동화면]
제가 졸면서 만드는 바람에 위 그림에 스펠링이 틀렸네요^^;;;
지금까지 Django를 이용해 말도 안되게 간단한 웹 어플리케이션을 만들어 보았습니다. MTV 패
턴에만 익숙해진다면 쉽게 만들 수 있을 것입니다. 그래서 Django와 MTV 패턴에 익숙해질 수 있
도록 아래에 다른 예제를 만들어 보겠습니다.
2. Django Example: Simple
Calculator
[Figure 12. Simple Calculator]
위 그림과 같이 Django를 이용해 간단한 계산기 웹 어플리케이션을 만들어보겠습니다. 계산한 결
과에 대해 DB에 저장하는 것은 다루지 않겠습니다. 이 예제의 학습 목적은 아래와 같습니다.
1. Django의 MTV 패턴 학습으로 Django와 익숙해지기
2. Template 개념의 이해
3. Web 기초
1. Request/Response의 이해
2. Form 태그의 이해
2.1 Project & App 만들기
1) Project 생성
Django로 웹 어플리케이션을 만들게되면 처음으로 하게되는 것은 Project를 만드는 것입니다.
$ django-admin.py startproject calculator
2) App 생성
그리고 Project 디렉토리로 이동해 App을 만들겠습니다.
$ cd calculator
$ django-admin.py startapp cal
Project와 App을 만드는 것은 익숙해지셔야 합니다. 지울 땐 그냥 디렉토리 또는 파일을 지우시면
됩니다. 특별한 명령어는 필요없습니다.
3) settings.py 설정
위에서 생성한 App을 settings.py 에 넣어줘야 App을 인식합니다. 아래와 같이 입력합니다.
INSTALLED_APPS = (
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'cal', # 추가
)
2.2 URL
이제는 사용자가 웹 페이지를 요청할 때 처음으로 처리해주는 URL 부분을 작성해 보겠습니다. 사
용자가 어떤 URL 주소로 들어왔는지 파악한 후 해당 함수(기능)으로 이어주는 부분입니다. 우리는
만약 사용자가 주소/cal 라는 경로로 접근했을 때 cal App 안에 있는 views 모듈의
calculate 함수를 이어주겠습니다.
from django.conf.urls import patterns, include, url
from django.contrib import admin
urlpatterns = patterns('',
url(r'^admin/', include(admin.site.urls)),
url(r'^cal/$', 'cal.views.calculate', name='calculate') # 추가
)
1) admin
Django고 편리한 것중에 하나는 Admin 페이지를 제공한다는 것입니다. 이 부분은 나중에 공부하
도록 하겠습니다.
2) patterns 함수
이 함수는 django.conf.urls 안에 있습니다. 우리가 pip으로 설치한 Django가 어딨었는지 기
억나시나요? 한 번 직접 patterns 함수가 어떻게 만들어져있는지 살펴보도록 하겠습니다.
def patterns(prefix, *args):
pattern_list = []
for t in args:
if isinstance(t, (list, tuple)):
t = url(prefix=prefix, *t)
elif isinstance(t, RegexURLPattern):
t.add_prefix(prefix)
pattern_list.append(t)
return pattern_list
일단 무슨 말인지 어렵습니다. 하하. 하지만 어려운 건 보지 마시고 나중에 익숙해지면 천천히 보
이실 겁니다.
+ 인자
인자 혹은 argument라고 부릅니다. 또는 parameter라고도 부릅니다. patterns라는 함수는 인자
로 아래와 같은 값을 받습니다.
1. prefix: URL의 접미어
2. *args: URL 패턴
patterns 함수는 URL 주소에 대한 패턴을 만들어주는 역할을 합니다. 여기에서 prefix 는 URL
주소의 접미어를 인자값으로 받겠다는 뜻이며, *args 는 그 외에 인자값을 뜻합니다. 즉, * 라는
것은 인자값을 다수를 뜻하고 args 는 임의로 써넣은 변수명일뿐입니다. 하지만 Python에서는
관례적인 표현으로 *args 라고 쓰곤 합니다.
+ 함수 내용
patterns 함수 안을 들여다 보면 인자값( *args )을 받아와서 pattern_list 라는 list에 조건에 맞
춰 받아온 인자값( *args )을 append(list에 추가)하는 것을 볼 수 있습니다. 조건은 아래와 같습니
다.
1. 받아온 인자값이
1. list or tuple일 때
2. Regular Express 형태의 URL 패턴일 때
위와 같은 조건일 때 각기 다른 행동을 하는 것을 볼 수 있습니다만, 우리는 더 깊게 보지 않고 우선
은 여기까지 보겠습니다. 다만 중요한 것은 첫 번째 인자값으로 URL의 접미어, 두 번째 인자값으로
URL 패턴을 받는다는 것을 알아야 합니다.
3) url 함수
위에서 살펴본 patterns 함수안에 두 번째부터의 인자값으로 url함수를 사용해 입력하고 있습니
다. 이 함수도 한 번 소스를 살펴보겠습니다. django.conf.urls 안에 있습니다.
def url(regex, view, kwargs=None, name=None, prefix=''):
if isinstance(view, (list, tuple)):
# For include(...) processing.
urlconf_module, app_name, namespace = view
return RegexURLResolver(regex, urlconf_module, kwargs,
app_name=app_name, namespace=namespace)
else:
if isinstance(view, six.string_types):
if not view:
raise ImproperlyConfigured('Empty URL pattern view
name not permitted (for pattern %r)' % regex)
if prefix:
view = prefix + '.' + view
return RegexURLPattern(regex, view, kwargs, name)
함수를 볼 때 처음으로 보는 것은 역시 인자값입니다. 함수 안에 있는 내용은 지금은 복잡하니 보
지 않겠습니다.
+ 인자
인자로 받는 값은 총 5개입니다.
1. regex
2. view
3. kwargs=None
4. name=None
5. prefix=”
첫 번째 인자값은 Regular Express 즉, 정규표현식입니다. 정규표현식으로 입력한 URL 주소값을
받습니다.
두 번째 인자값은 view입니다. 즉, views.py 안에 있는 함수를 인자값으로 받습니다.
세 번째 인자값부터는 이상하게 변수에 할당하는 모습처럼 보입니다. 이것을 키워드 인자 혹은
Keyword Argument라고 부릅니다. 이 키워드 인자값은 순서를 상관하지 않습니다. 해당 키워드
만 매칭이 되면 해당 값을 찾을 수 있거든요.
kwargs와 name은 default 값으로 None이 들어가 있습니다. prefix의 경우엔 “(빈 값)이 들어가
있습니다.
여기서 눈여겨 볼 것은 regex, view, name입니다.
urlpatterns = patterns('',
url(r'^admin/', include(admin.site.urls)),
url(r'^cal/$', 'cal.views.calculate', name='calculate') # 추가
)
1. regex: r'^cal/$'
2. view: 'cal.views.calculate'
3. name: 'calculate'
regex
정규표현식 r'^cal/$' 은 사용자가 호스트주소/cal 으로 접속했을 때를 말합니다. 여기서 정
규표현식 ^은 시작을 의미하며 $은 끝을 의미합니다. 정규표현식은 공부할 게 많아 여기서는 깊게
다루지 않겠습니다. 보통 패스워드를 입력할 때 대소문자와 숫자가 있어야한다 와 같은 규칙을 사
용할 때 쓰입니다.
view
cal App 안에 있는 views 모듈의 calculate 함수를 실행하라는 의미입니다. 이를 보통은
view 함수라고 말합니다.
name
이 URL 패턴의 이름을 뜻합니다. 이는 유용하게 사용됩니다. 우리는 좀 있다 보게 될 Template 문
서에서 이 name을 사용하게 될 것입니다.
2.3 VIEW
1) 로직
이제 URL을 작성했으니 다음으로는 판도라의 상자, views.py 에 함수를 작성해 보겠습니다. 여
기서 사용자에게 숫자값을 입력받아 더하기, 빼기, 곱하기, 나누기 연산을 구현해 보겠습니다.
로직은 아래와 같습니다.
1. 사용자의 요청(request) 방식(method)이 GET 이면
1. 아무것도 하지 않고 calculate.html 템플릿 파일을 렌더링해 보여줍니다.
2. 사용자의 요청(request) 방식(method)이 POST 이면
1. 사용자가 입력한 number1 값을 number1이라는 변수에 저장합니다.
2. 사용자가 입력한 number2 값을 number2이라는 변수에 저장합니다.
3. 사용자가 지정한 연산자를 operation이라는 변수에 저장합니다.
4. 만약 operation이라는 변수 값이
1. plus 이면 더하기 연산을 해 결과를 result 변수에 할당합니다.
2. minus 이면 빼기 연산을 해 결과를 result 변수에 할당합니다.
3. multiply 이면 곱하기 연산을 해 결과를 result 변수에 할당합니다.
4. divide 이면 나누기 연산을 해 결과를 result 변수에 할당합니다.
3. 연산 결과값인 result 변수를 렌더링하여(render) calculate.html 템플릿 파일에
request 와 함께 보냅니다.
2) 템플릿 파일
위의 로직을 Python으로 기술하면 아래와 같습니다.
# coding: UTF-8
from django.shortcuts import render
def calculate(request):
"""
사용자로부터 값을 입력받아 계산하는 함수
"""
result = ""
if request.method == "GET":
pass
elif request.method == "POST":
number1 = int(request.POST['number1'])
number2 = int(request.POST['number2'])
operation = request.POST['operation']
if operation == "plus":
result = number1 + number2
elif operation == "minus":
result = number1 - number2
elif operation == "multiply":
result = number1 * number2
elif operation == "divide":
result = number1 / number2
else:
result = "Nonthing"
return render(request, 'calculate.html', {
'result': result,
})
3) GET일 때와 POST일 떄로 나누는 이유
한 페이지에서 사용자가 값을 입력할 수 있는 양식을 보여주기도 하고(GET) 사용자가 입력한 값을
가져오기도(POST) 하기 때문입니다. 그렇기 때문에 사용자가 어떤 방식으로 접근했느냐에 따라
사용자가 값을 입력할 수 있도록 폼 양식을 보여주거나, 사용자가 값을 입력해 계산 버튼을 눌렀을
경우이거나 두 가지로 나누는 것입니다.
4) render 함수
이렇게 결과값을 result 라는 변수에 저장하고 나서 이를 calculate.html 템플릿 파일에 반
환해줘야 합니다. 이럴 때 쓰는 함수가 render 함수입니다. 이는 템플릿 파일에 보낼 값들
(Context)을 렌더링해주는 역할을 합니다. 이 함수의 인자값은 아래와 같습니다.
1. request
2. 템플릿 파일: 'calculate.html'
3. 템플릿 파일에 넘겨줄 값: {'result': result}
render 함수의 첫 번째 인자값은 항상 request 객체입니다. 두 번째부터는 순서에 상관없지만 보
통은 두 번째로 템플릿 파일을 세 번째로 넘겨줄 값을 사전형 객체로 적어줍니다. 사전형 객체의
key가 템플릿에서 사용하게 될 객체가 됩니다.
2.4 TEMPLATE
View 함수를 작성했으니 이제는 사용자가 계산하고 싶은 값을 입력받을 UI인 Template을 만들 차
례입니다. 이 Template 파일에는 사용자가 값을 입력하고 계산 결과값도 보여줍니다. 하지만 코
딩을 하기 전에 템플릿을 사용하기 위한 세팅을 해야 합니다.
1) Template이 저장될 디렉토리 만들기
먼저 우리가 만들 calculate.html 파일이 저장될 디렉토리를 만들겠습니다. 프로젝트 최상위
경로에서 아래오 같이 실행합니다.
$ mkdir templates
디렉토리 이름은 아무거나 입력해도 상관없지만 여기서는 templates 라고 하겠습니다.
2) Template을 사용하겠다고 세팅하기
우리는 이제 template을 사용하겠다고 세팅을 해줘야 합니다. settings.py 에 아래와 같이 입
력합니다.
# Build paths inside the project like this:
os.path.join(BASE_DIR, ...)
import os
BASE_DIR = os.path.dirname(os.path.dirname(__file__))
TEMPLATE_DIRS = (os.path.join(BASE_DIR, 'templates'),) # 추가
위에 작성한 것처럼 TEMPLATE_DIRS 라는 변수에 값을 넣어주는 것입니다. 문서 어디에 넣어도
상관없습니다. 단, TEMPLATE_DIRS 에 BASE_DIR 이라는 변수를 사용하고 있기 때문에
BASE_DIR 이라는 변수 위에 입력해서는 안됩니다. 그래서 일부러 BASE_DIR 변수 바로 아래
부분에 입력해 놓았습니다.
(os.path.join(BASE_DIR, 'templates'),) 의 의미는 BASE_DIR 이라는 프로젝트 최상
위 경로가 들어가 있는 변수에 우리가 새로 만든 디렉토리인 templates 를 join (조인) 하겠다
는 뜻입니다. 즉 우리가 만든 디렉토리 경로를 TEMPLATE_DIRS 에 할당해준 것뿐입니다.
3) Template 파일에서 request 객체를 사용하겠다고 세
팅하기
settings.py 파일에 아래 부분을 아무곳에나 입력해 줍니다.
TEMPLATE_CONTEXT_PROCESSORS = (
"django.contrib.auth.context_processors.auth",
"django.core.context_processors.debug",
"django.core.context_processors.i18n",
"django.core.context_processors.media",
"django.core.context_processors.static",
"django.core.context_processors.tz",
"django.contrib.messages.context_processors.messages",
'django.core.context_processors.request',
)
이 부분은 Template Context Processor 즉, 템플릿 컨텍스트 처리기라고 합니다. 템플릿 파일에
특정값(Context)을 보낼 때 일부 특수한 처리가 필요한 게 있습니다. 바로 그런 부분을 누가하는
지 써넣어준 것입니다. 이는 외울 필요가 전~혀~ 없습니다. 그냥 복사 붙여넣기 하시면 됩니다.
자세한 것은 공식 문서를 참고하시기 바랍니다.
4) template file 작성
아래와 같이 우리가 만들 calculate.html 을 작성하고 이를 templates 디렉토리에 저장합
니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Simple Calculator Using Django</title>
</head>
<body>
<h1>Simple Calculator Using Django</h1>
<form action="{% url 'calculate' %}" method="post">
{% csrf_token %}
<p>
<label for="number1">숫자1 :</label>
<input type="number" name="number1" value="0">
</p>
<p>
<label for="number2">숫자2 :</label>
<input type="number" name="number2" value="0">
</p>
<p>
<select name="operation">
<option value="plus">+</option>
<option value="minus">-</option>
<option value="multiply">x</option>
<option value="divide">/</option>
</select>
<input type="text" name="result" value="{{ result }}"
disabled>
</p>
<p>
<button type="submit" name="submit">계산하기</button>
</p>
</form>
</body>
</html>
+ Form태그
우리가 중요하게 살펴볼 태그입니다.
<form action="{% url 'calculate' %}" method="post">
form 태그 안에 중요한 속성 두 가지가 있습니다.
1. action: 전송(submit) 버튼을 눌렀을 때 데이터를 어디로 보내줄 것인지
2. method: 전송 방식은 어떤 것인지 (GET or POST)
GET 방식은 엽서로 생각하시면 편합니다. 누가, 누구에게, 어떤 내용으로라는 정보가 다 보이지
요. POST 방식은 봉투에 동봉된 편지라고 생각하면 됩니다. 그 안에 들어가 있는 정보가 보이지
않지요. 이 방식은 사용자가 요청(request)했을 때의 방식입니다. 이 부분은 깊게 들어가지 않고
여기까지만 보겠지만 일반적으로 데이터를 주고 받을 때 POST 방식을 사용한다고 생각하시면 됩
니다.
+ {% .. %}
이 것은 무엇일까요. 바로 Django에서 제공하는 Template Language 표현 방식입니다. 표현 방
식에는 두 가지가 있습니다.
1. Template tag: {% %}
2. Template variable: {{ }}
+ {% url ‘calculate’ %}
Django에서 제공하는 템플릿 언어중에 url이라는 함수를 이용하는 것입니다. 템플릿 언어의 양식
은 함수에 인자값을 넣을 때 함수 한 칸 띄고 인자값을 입력해주면 됩니다. 즉 calculate 라는 이
름을 가진 URL주소를 반환해줍니다.
생각나시나요? calculate 라는 URL 이름을 어디서 작성했었나요? 바로 urls.py 에서 작성했
었습니다. 즉 반환값은 호스트주소/cal 이 될 것입니다. 전송 버튼을 누를 때 POST 방식으로 이
URL로 접속을 하면 다시 cal.views.calculate 함수를 실행하게 되고, 이 때 request (요청)
방식(method)은 POST 방식이기 때문에 calculate 함수 안에 request.method 가 POST 일
때 조건의 아랫부분을 실행하게 되는 것입니다.
+ {% csrf_token %}
CSRF는 Cross-Site Request Forgery를 말합니다. CSRF는 웹 취약점 공격으로 희생자가 자신의
의지와는 무관하게 해커가 의도한 행위 (수정, 삭제, 생성 등)를 특정 웹 사이트에 요청하는 공격입
니다.
그런데 Django는 이런 공격을 막아줄 수 있는 보안처리를 이미 마련해주고 있습니다. 바로
csrf_token입니다. 이는 꼭 Form 태그 아래에 써줘야하며 이를 써주지 않으면 바로 에러가 나니
유의하시기 바랍니다.
+ {{ result }}
<input type="text" name="result" value="{{ result }}" disabled>
우리가 views.py 에서 연산을 하고 나온 결과값을 result라는 변수에 넣어주었습니다. 그리고
그것은 템플릿 파일에 넘겨줄 때 result라는 이름으로 넘겨주었습니다. 그 때 넘겨준 이름을 템플
릿 변수에 넣어주면 해당 값이 출력됩니다.
3. Summary
우리는 이번 챕터에 아주 간단한 예제 2개를 통해 Django를 공부하였습니다.
드디어 MTV 패턴의 템플릿도 해보았습니다. 다다음 챕터에는 모델을 다뤄보도록 하겠습니다.
실제로 처음이라 어려웠을 수도 있습니다. 각자 로컬 컴퓨터에서 지우고 다시 만들어보고 실패해
보고 에러내보고 성공해보고, 시행착오를 거치길 권장합니다. 에러를 많이 보는 것이 학습의 지름
길이라 생각합니다.
Written by initialkommit@Study-Bee.
1. http://www.zachariahrosenberg.com/
2. https://docs.djangoproject.com/en/1.7/topics/http/urls/#syntax-of-the-urlpatterns-
variable

More Related Content

What's hot

REST Easy with Django-Rest-Framework
REST Easy with Django-Rest-FrameworkREST Easy with Django-Rest-Framework
REST Easy with Django-Rest-FrameworkMarcel Chastain
 
Django Interview Questions and Answers
Django Interview Questions and AnswersDjango Interview Questions and Answers
Django Interview Questions and AnswersPython Devloper
 
Django - Python MVC Framework
Django - Python MVC FrameworkDjango - Python MVC Framework
Django - Python MVC FrameworkBala Kumar
 
Introduction to Django
Introduction to DjangoIntroduction to Django
Introduction to DjangoJames Casey
 
Deep dive into Vue.js
Deep dive into Vue.jsDeep dive into Vue.js
Deep dive into Vue.js선협 이
 
Django, What is it, Why is it cool?
Django, What is it, Why is it cool?Django, What is it, Why is it cool?
Django, What is it, Why is it cool?Tom Brander
 
Django Rest Framework - Building a Web API
Django Rest Framework - Building a Web APIDjango Rest Framework - Building a Web API
Django Rest Framework - Building a Web APIMarcos Pereira
 
Odoo Experience 2018 - The Odoo JS Framework
Odoo Experience 2018 - The Odoo JS FrameworkOdoo Experience 2018 - The Odoo JS Framework
Odoo Experience 2018 - The Odoo JS FrameworkElínAnna Jónasdóttir
 
Angular Notes.pdf
Angular Notes.pdfAngular Notes.pdf
Angular Notes.pdfsagarpal60
 
Introduction to Django REST Framework, an easy way to build REST framework in...
Introduction to Django REST Framework, an easy way to build REST framework in...Introduction to Django REST Framework, an easy way to build REST framework in...
Introduction to Django REST Framework, an easy way to build REST framework in...Zhe Li
 
Django nutshell overview
Django nutshell overviewDjango nutshell overview
Django nutshell overviewschacki
 
Django Tutorial | Django Web Development With Python | Django Training and Ce...
Django Tutorial | Django Web Development With Python | Django Training and Ce...Django Tutorial | Django Web Development With Python | Django Training and Ce...
Django Tutorial | Django Web Development With Python | Django Training and Ce...Edureka!
 
Why and How to Use Virtual DOM
Why and How to Use Virtual DOMWhy and How to Use Virtual DOM
Why and How to Use Virtual DOMDaiwei Lu
 
Introduction to django framework
Introduction to django frameworkIntroduction to django framework
Introduction to django frameworkKnoldus Inc.
 
Django Introduction & Tutorial
Django Introduction & TutorialDjango Introduction & Tutorial
Django Introduction & Tutorial之宇 趙
 

What's hot (20)

REST Easy with Django-Rest-Framework
REST Easy with Django-Rest-FrameworkREST Easy with Django-Rest-Framework
REST Easy with Django-Rest-Framework
 
Django Interview Questions and Answers
Django Interview Questions and AnswersDjango Interview Questions and Answers
Django Interview Questions and Answers
 
Django - Python MVC Framework
Django - Python MVC FrameworkDjango - Python MVC Framework
Django - Python MVC Framework
 
Introduction to Django
Introduction to DjangoIntroduction to Django
Introduction to Django
 
Deep dive into Vue.js
Deep dive into Vue.jsDeep dive into Vue.js
Deep dive into Vue.js
 
Nuxtjs cheat-sheet
Nuxtjs cheat-sheetNuxtjs cheat-sheet
Nuxtjs cheat-sheet
 
Django, What is it, Why is it cool?
Django, What is it, Why is it cool?Django, What is it, Why is it cool?
Django, What is it, Why is it cool?
 
Django Rest Framework - Building a Web API
Django Rest Framework - Building a Web APIDjango Rest Framework - Building a Web API
Django Rest Framework - Building a Web API
 
Odoo Experience 2018 - The Odoo JS Framework
Odoo Experience 2018 - The Odoo JS FrameworkOdoo Experience 2018 - The Odoo JS Framework
Odoo Experience 2018 - The Odoo JS Framework
 
Angular Notes.pdf
Angular Notes.pdfAngular Notes.pdf
Angular Notes.pdf
 
Introduction to Django REST Framework, an easy way to build REST framework in...
Introduction to Django REST Framework, an easy way to build REST framework in...Introduction to Django REST Framework, an easy way to build REST framework in...
Introduction to Django REST Framework, an easy way to build REST framework in...
 
Django nutshell overview
Django nutshell overviewDjango nutshell overview
Django nutshell overview
 
django
djangodjango
django
 
An introduction to Vue.js
An introduction to Vue.jsAn introduction to Vue.js
An introduction to Vue.js
 
Ngrx slides
Ngrx slidesNgrx slides
Ngrx slides
 
Angular routing
Angular routingAngular routing
Angular routing
 
Django Tutorial | Django Web Development With Python | Django Training and Ce...
Django Tutorial | Django Web Development With Python | Django Training and Ce...Django Tutorial | Django Web Development With Python | Django Training and Ce...
Django Tutorial | Django Web Development With Python | Django Training and Ce...
 
Why and How to Use Virtual DOM
Why and How to Use Virtual DOMWhy and How to Use Virtual DOM
Why and How to Use Virtual DOM
 
Introduction to django framework
Introduction to django frameworkIntroduction to django framework
Introduction to django framework
 
Django Introduction & Tutorial
Django Introduction & TutorialDjango Introduction & Tutorial
Django Introduction & Tutorial
 

Viewers also liked

QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기
QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기
QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기Kwangyoun Jung
 
Python+anaconda Development Environment
Python+anaconda Development EnvironmentPython+anaconda Development Environment
Python+anaconda Development EnvironmentKwangyoun Jung
 
Python, Development Environment for Windows
Python, Development Environment for WindowsPython, Development Environment for Windows
Python, Development Environment for WindowsKwangyoun Jung
 
문과생 대상 파이썬을 활용한 데이터 분석 강의
문과생 대상 파이썬을 활용한 데이터 분석 강의문과생 대상 파이썬을 활용한 데이터 분석 강의
문과생 대상 파이썬을 활용한 데이터 분석 강의Kwangyoun Jung
 
장고로 웹서비스 만들기 기초
장고로 웹서비스 만들기   기초장고로 웹서비스 만들기   기초
장고로 웹서비스 만들기 기초Kwangyoun Jung
 

Viewers also liked (6)

python and database
python and databasepython and database
python and database
 
QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기
QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기
QnA Blog Using Django - 회원가임/로그인폼, Post, 글보기
 
Python+anaconda Development Environment
Python+anaconda Development EnvironmentPython+anaconda Development Environment
Python+anaconda Development Environment
 
Python, Development Environment for Windows
Python, Development Environment for WindowsPython, Development Environment for Windows
Python, Development Environment for Windows
 
문과생 대상 파이썬을 활용한 데이터 분석 강의
문과생 대상 파이썬을 활용한 데이터 분석 강의문과생 대상 파이썬을 활용한 데이터 분석 강의
문과생 대상 파이썬을 활용한 데이터 분석 강의
 
장고로 웹서비스 만들기 기초
장고로 웹서비스 만들기   기초장고로 웹서비스 만들기   기초
장고로 웹서비스 만들기 기초
 

Similar to Light Tutorial Django

[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)
[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)
[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)YoungSu Son
 
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220Seomgi Han
 
Project anarchy로 3d 게임 만들기 part_2_vforge피하기
Project anarchy로 3d 게임 만들기 part_2_vforge피하기Project anarchy로 3d 게임 만들기 part_2_vforge피하기
Project anarchy로 3d 게임 만들기 part_2_vforge피하기Dong Chan Shin
 
구글앱엔진+스프링+스프링datajpa+메이븐
구글앱엔진+스프링+스프링datajpa+메이븐구글앱엔진+스프링+스프링datajpa+메이븐
구글앱엔진+스프링+스프링datajpa+메이븐라한사 아
 
Project anarchy로 3 d 게임 만들기 part_1
Project anarchy로 3 d 게임 만들기 part_1Project anarchy로 3 d 게임 만들기 part_1
Project anarchy로 3 d 게임 만들기 part_1Dong Chan Shin
 
LucideWorks Banana 소개
LucideWorks Banana 소개 LucideWorks Banana 소개
LucideWorks Banana 소개 SuHyun Jeon
 
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기XpressEngine
 
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁창규 김
 
막하는 스터디 네 번째 만남 AngularJs (20151108)
막하는 스터디 네 번째 만남 AngularJs (20151108)막하는 스터디 네 번째 만남 AngularJs (20151108)
막하는 스터디 네 번째 만남 AngularJs (20151108)연웅 조
 
파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 Yong Joon Moon
 
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기hajaekwon
 
Web_06_Ruby On Rails (임시)
Web_06_Ruby On Rails (임시)Web_06_Ruby On Rails (임시)
Web_06_Ruby On Rails (임시)team air @ Dimigo
 
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&CJavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&Csys4u
 
구글앱엔진 스터디
구글앱엔진 스터디구글앱엔진 스터디
구글앱엔진 스터디소라 정
 
Java rmi 개발 가이드
Java rmi 개발 가이드Java rmi 개발 가이드
Java rmi 개발 가이드중선 곽
 
스타트업 인턴 개발자 3달간의 고군분투기 김은향
스타트업 인턴 개발자 3달간의 고군분투기 김은향스타트업 인턴 개발자 3달간의 고군분투기 김은향
스타트업 인턴 개발자 3달간의 고군분투기 김은향Eunhyang Kim
 
Parse.com 맛보기
Parse.com 맛보기Parse.com 맛보기
Parse.com 맛보기flashscope
 
Data-binding AngularJS
Data-binding AngularJSData-binding AngularJS
Data-binding AngularJSEunYoung Kim
 

Similar to Light Tutorial Django (20)

[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)
[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)
[NEXT] Android 개발 경험 프로젝트 4일차 (Networking)
 
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220
피플펀드 웹서비스 성능개선기(+초기 스타트업의 개발방법론) 20171220
 
Project anarchy로 3d 게임 만들기 part_2_vforge피하기
Project anarchy로 3d 게임 만들기 part_2_vforge피하기Project anarchy로 3d 게임 만들기 part_2_vforge피하기
Project anarchy로 3d 게임 만들기 part_2_vforge피하기
 
구글앱엔진+스프링+스프링datajpa+메이븐
구글앱엔진+스프링+스프링datajpa+메이븐구글앱엔진+스프링+스프링datajpa+메이븐
구글앱엔진+스프링+스프링datajpa+메이븐
 
Project anarchy로 3 d 게임 만들기 part_1
Project anarchy로 3 d 게임 만들기 part_1Project anarchy로 3 d 게임 만들기 part_1
Project anarchy로 3 d 게임 만들기 part_1
 
LucideWorks Banana 소개
LucideWorks Banana 소개 LucideWorks Banana 소개
LucideWorks Banana 소개
 
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기
XECon2015 :: [2-2] 박상현 - React로 개발하는 SPA 실무 이야기
 
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁
R.java가 사라졌어요 어떻하죠?:Aquery라이브러리와 안드로이드 개발팁
 
막하는 스터디 네 번째 만남 AngularJs (20151108)
막하는 스터디 네 번째 만남 AngularJs (20151108)막하는 스터디 네 번째 만남 AngularJs (20151108)
막하는 스터디 네 번째 만남 AngularJs (20151108)
 
파이썬 플라스크 이해하기
파이썬 플라스크 이해하기 파이썬 플라스크 이해하기
파이썬 플라스크 이해하기
 
(스프링프레임워크 강좌)스프링부트개요 및 HelloWorld 따라하기
(스프링프레임워크 강좌)스프링부트개요 및 HelloWorld 따라하기(스프링프레임워크 강좌)스프링부트개요 및 HelloWorld 따라하기
(스프링프레임워크 강좌)스프링부트개요 및 HelloWorld 따라하기
 
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기
Softcon_하재권_Only javascript의 하이브리드 앱서버 도전기
 
Web_06_Ruby On Rails (임시)
Web_06_Ruby On Rails (임시)Web_06_Ruby On Rails (임시)
Web_06_Ruby On Rails (임시)
 
Spring Boot 1
Spring Boot 1Spring Boot 1
Spring Boot 1
 
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&CJavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
JavaScript Profiling With The Chrome Developer Tools_SYS4U I&C
 
구글앱엔진 스터디
구글앱엔진 스터디구글앱엔진 스터디
구글앱엔진 스터디
 
Java rmi 개발 가이드
Java rmi 개발 가이드Java rmi 개발 가이드
Java rmi 개발 가이드
 
스타트업 인턴 개발자 3달간의 고군분투기 김은향
스타트업 인턴 개발자 3달간의 고군분투기 김은향스타트업 인턴 개발자 3달간의 고군분투기 김은향
스타트업 인턴 개발자 3달간의 고군분투기 김은향
 
Parse.com 맛보기
Parse.com 맛보기Parse.com 맛보기
Parse.com 맛보기
 
Data-binding AngularJS
Data-binding AngularJSData-binding AngularJS
Data-binding AngularJS
 

Light Tutorial Django

  • 1. 1. Django Essentials 자, 이제부터 본격적으로 Django를 이용해 개발해 볼 시간입니다. 하지만 언제나 개발 환경을 먼 저 생각하셔야합니다. 항상 먼저 실행할 것은 개발할 가상 환경에 접속하는 것입니다. $ workon studybee 1.1 Where is Django? [Figure 1. Django 경로] 1) Django 경로 ~/.virtualenvs/studybee/local/lib/python2.7/site-packages/django 우리는 현재 virtualenv를 통해 만든 가상 환경에 들어가서 Django를 설치하였습니다. 따라서 Django가 어딨는지 확인해보려면 가상 환경이 저장된 곳 안으로 먼저 들어가야 합니다. 우리는 가상 환경이 저장될 곳을 ~/.virtualenvs 로 지정했고 저는 studybee 라는 이름으로 가상환경을 만들었기 때문에 경로가 ~/.virtualenvs/studybee 로 시작하는 것입니다. 2) Django 경로를 알아야 하는 이유
  • 2. Django는 다른 개발자에 의해 만들어진 기능의 집합이며 오픈 소스입니다. 즉, 어떤 기능이 어떻 게 동작되는지 알기 위해선 첫 번째로 공식 문서를 봐야합니다. 두 번째로는 직접 해당 소스를 보 는 것입니다. 다른 훌륭한 개발자가 만든 것이기 때문에 어떻게 프로그래밍하는지 습득할 수도 있 어 일거양득입니다. 1.2 Structure of Django 1) 구조 [Figure 2. Django 구조(Project와 App)] Django의 전체적인 구조는 위와 같이 생겼습니다. 최상단에 Project가 있고 아래에 시작 패키지 디렉토리와 App이 있습니다. 그리고 그 App안에는 MTV 패턴을 따르는 파일이 존재합니다. 1. Project 1. 시작 패키지: Project의 전반적인 환경을 설정할 수 있습니다. 1. __init__.py: 이 디렉토리를 파이썬 패키지로 만들어 줍니다. 2. settings.py: Django 프로젝트를 설정합니다. Database 등을 설정할 수 있습 니다. 3. urls.py: URL 주소와 Django의 기능(함수)을 연결시켜줍니다.
  • 3. 2. 앱(app) 1. __init__.py: 이 디렉토리를 파이썬 패키지로 만들어 줍니다. 2. admin.py: 관리자 항목을 설정할 수 있습니다. 3. models.py: 데이터베이스 구조를 만드는 파일입니다. 4. urls.py: 앱과 관련된 URL 주소와 Django의 기능(함수)을 연결시켜줍니다. 5. views.py: 판다로의 상자처럼 무언가 행동을 하는 부분입니다. 3. manage.py: 프로젝트를 관리하는 파일입니다. Web server 구동 등의 기능이 있습 니다. 2) Project 생성 Django의 첫 번쨰는 Project를 만드는 것입니다. 각자의 작업 폴더에 들어가서 아래와 같이 실행 해 보겠습니다. 예를 들면 가상 머신과의 공유 폴더인 ~/Code/ 에 가서 아래와 같이 실행합니다. $ django-admin.py startproject studybee 위와 같이 실행하면 Django가 자동으로 studybee 라는 프로젝트명으로 필요한 폴더와 파일을 생성해줍니다. 만약 위와 같이 실행하지 않는다면 수작업으로 일일이 폴더를 만들고 파일을 만들 어주면 됩니다. 하지만 귀찮지요? 그래서 Django에서는 위와 같은 명령어를 제공해주는 것입니 다. [Figure 3. Project 생성 후 폴더와 파일]
  • 4. Project를 생성하면 위와 같은 그림이 나옵니다. 즉 manage.py 파일과 studybee 라는 시작 패 키지 폴더를 볼 수 있으며 시작 패키지 안에 들어가면 4개의 파일이 자동으로 생성되어 있음을 볼 수 있습니다. + 만약에 Project를 지우고 싶다면? Django는 쉽게 Project에 필요한 파일과 폴더를 만들어줄 뿐입니다. 응용 프로그램이 아니지요. 그래서 생성한 Project를 지우기만 하면 됩니다. 아래처럼요. $ rm -rf studybee 3) App 생성 Django의 두 번째는 Project 내에 App을 만드는 것입니다. Project 내로 이동해서 아래와 같이 실 행합니다. $ django-admin.py startapp qna 위와 같이 실행하면 Django는 qna app에 필요한 폴더와 파일을 생성해줍니다. 위와 같은 명령어 를 실행하고 싶지 않다면 손수 폴더와 파일을 만들어주면 됩니다. 하지만 귀찮지요?! 그래서 Django는 위 명령어를 제공하는 것입니다.
  • 5. [Figure 4. App 생성 이 후 폴더와 파일] App을 생성하고 나면 위와 같은 화면이 나옵니다. qna 라는 폴더가 생기고 이 안을 보면 5개의 파 일과 1개의 폴더가 자동으로 생성되어 있는 것을 확인할 수 있습니다. 1.3 MTV Pattern 위에서 Django의 기본 구조인 Project와 App을 알아봤습니다. 이제는 소프트웨어 공학적인 측면 의 개발 방법론인 MTV Pattern을 알아보겠습니다. [Figure 5. Django의 Project 구조와 MTV Pattern] 위에서 보는 것과 같이 지금까지 우리는 Project를 만들고 그 안에 App을 만들었습니다. 그리고 이 Project에 MTV에 해당하는 파일을 작성하는 것을 MTV Pattern으로 개발한다고 합니다. 그런데 이 MTV Pattern을 이용해 Web application을 만들면 어떻게 작동하는지 아래 그림으로 알 아보도록 하겠습니다.
  • 6. [Figure 6. MTV 작동 원리 ] 이 동작 원리가 상당히 중요합니다. 이 것만 잘 이해하고 넘어가면 Django의 첫 문턱은 무사히 넘 어간 거나 다름없습니다. 1
  • 7. MTV를 이용한 요청/응답 프로세스 1. 먼저 사용자가 브라우저를 이용해 특정 페이지에 접근합니다. (요청) 2. 이 때 Django는 Urls를 통해 사용자가 접속한 URL에 해당하는 Views안의 함수를 연결해 줍 니다. 3. Django의 Views는 필요한 경우 데이터를 가져오기 위해 Models를 통해 Database에 접근 합니다. 4. Views는 가져온 데이터를 처리한 결과물을 1. 바로 사용자의 브라우저에 보여줍니다. (응답) 2. Templates를 통해 사용자의 브라우저에 보여줍니다. (응답) 이 구조가 바로 MTV입니다. 하나의 파일로 처리할 수도 있지만 이렇게 논리구조를 나누어 개발할 때 편의성을 제공하는 것입니다. 그래서 이것을 소프트웨어 공학적 개발 방법론 이라고도 합니다. [Figure 7. MTV 작동 원리] 위에서 설명한 것을 조금 더 구체적으로 그려보면 위 그림과 같습니다. 초록색 박스는 부가적인 것 이기 때문에 지금은 보지 않아도 괜찮습니다. 번호가 매겨진 순서대로 작동합니다. 즉 사용자의 요청과 응답에 대한 프로세스인 것입니다. 이 흐 름을 잘 익혀두어야 합니다. 가장 기본이기 때문입니다.
  • 8. 이제는 위 구조를 가지고 간단한 웹 어플리케이션을 만들어 보겠습니다. 1.4 Hello, World! App Django를 이용해 웹 브라우저 화면에 Hello, World!를 출력하는 웹 어플리케이션을 만들어 보겠습 니다. 1. helloworld라는 Project 생성 $ django-admin.py startproject helloworld 2. say라는 App 생성 위에서 만든 Project 폴더에 들어가 아래와 같이 실행합니다. $ django-admin.py startapp say 3. Project 세팅 이제 본격적으로 작성해보겠습니다. 개발할 때는 유료같은 무료 에디터인 Sublime Text 3을 추천 합니다.. 먼저 세팅을 하겠습니다. App을 생성했으면 항상 Project 세팅 파일의 내용을 변경해야 합니다. 에디터를 이용해 Project의 세팅값이 들어가 있는 시작 패키지 내 settings.py 을 오픈 합니다. 이미 여러가지 내용이 들어가 있을 것입니다. Project 생성 시 기본적으로 Django가 넣어준 내용 입니다. 여기에서 INSTALLED_APPS 를 찾아 위에서 만든 App을 등록해줍니다. 다 등록을 하면 아래와 같이 됩니다. INSTALLED_APPS = ( 'django.contrib.admin', 'django.contrib.auth',
  • 9. 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'say', ) 이미 설치된 App이 많이 있음을 알 수 있습니다. INSTALLED_APPS 라는 객체의 형태는 튜플입니 다. 여기에 우리가 만든 say 라는 이름의 App을 추가해준 것 뿐입니다. 4. 잘 작동되는지 확인 이제 helloworld 라는 웹 어플리케이션이 작동할 준비가 다 되었습니다. 본격적으로 Hello World!를 보여주기 전에 잘 작동하는지 확인해보겠습니다. 아래와 같이 실행합니다. 1) 웹서버 구동 $ python manage.py runserver 192.168.10.10:8000 Django는 이미 작고 가벼운 웹서버를 내장하고 있습니다. 개발 시에는 빠르게 개발할 필요가 있기 때문에 Django도 기본으로 작고 가벼운 웹서버를 제공해주고 있는 것입니다. 이 웹서버를 이용해 웹서버를 실행시키는데 IP 주소와 포트 번호를 옆에 입력해 줍니다. 2) 웹 브라우저로 접속 이제 각자의 로컬 컴퓨터에서 브라우저를 실행해 192.168.10.10:8000 을 입력해 접속해보겠 습니다. 정상적이라면 아래오 같은 화면이 나올 것입니다.
  • 10. [Figure 8. 정상적으로 세팅했을 때 나오는 첫 화면] 5. URL 등록 정상적으로 작동하는 것을 확인했으면 이제 본론으로 돌아가서 Hello, World!를 화면에 출력하는 것을 계속해서 만들어 보겠습니다. 처음에 URL 부터 등록해 보겠습니다. 개발 순서는 상관없습니 다다. 그런데 왜 URL부터 등록을 하려고 할까요? 1) MTV의 프로세스를 다시 생각해봅시다.
  • 11. [Figure 9. Django MTV 프로세스] Django는 모든 파일을 URL로 설계해서 접근해야 합니다. 사진, 음악파일, html파일, Javascript 파일 등 어떠한 것도 예외가 없습니다. urls.py는 사용자가 어떤 경로로 접근을 했는지 파악해서 해당 기능(혹은 파일)으로 이어주는 역할을 합니다. 그런데 여기서 중요한 것은 프로세스입니다. 즉 위와 같이 Django의 MTV 프로세스를 생각해보면 사용자가 웹 브라우저로 접속했을 경우, 처음으로 대응하는 것은 바로 Django project의 시작 패 키지 안에 있는 urls.py입니다. 2) urls.py 작성 순서는 상관없지만 여기서는 위 프로세스 대로 작성해보겠습니다. 에디터로 Project 안에 있는 시 작 패키지 디렉토리의 urls.py파일을 열어 아래와 같이 작성합니다.
  • 12. [Figure 10. helloworld 프로젝트 > 시작 패키지 > urls.py] 시작 패키지 안에 있는 urls.py를 작성한 화면입니다. 3) urlpatterns urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^$', 'say.views.sayhello'), ) 위 코드를 보면 urlpatterns 라는 변수에 특정값을 할당해주고 있습니다. 이 변수를 통해서 Django는 URL 주소를 인식하는 것입니다. 이 변수의 데이터 타입은 list입니다. 4) patterns 함수 urlpatterns라는 변수에는 patterns라는 함수를 사용하여 특정값을 넣어주고 있습니다. 그리고 해당 함수에 들어가는 인자값 첫 번째는 '' (빈 값)만 들어가 있고, 두 번째부터는 url함수를 이용 해서 사용자가 접속한 URL주소를 파악하고 있습니다. 2
  • 13. urlpatterns라는 변수에는 항상 patterns라는 함수를 사용합니다. 이는 공식문서를 통해서 자세 한 내용을 확인할 수 있습니다. 5) url 함수 url함수를 통해서 사용자가 요청한 URL 주소를 확인하고 해당 주소에 맞는 함수로 이동시킵니다. 그래서 이 함수의 첫 번째 값은 URL 주소이고 두 번째 인자값은 이동할 함수로 구성되어 있습니다. 공식문서를 통해서 자세한 내용을 확인할 수 있습니다. + URL주소 - Regular Expression url함수의 첫 번째 인자값으로 r'^$' 라는 이상한 값이 들어가 있습니다. 이는 Regular Expression이라고 하는 것인데, 사용자가 어떤 값을 입력했는지 파악하는데 사용합니다. ^(Caret) 은 시작을 의미하고 $은 끝을 의미합니다. 즉 r'^$' 의 의미는 사용자가 아무것도 입력하지 않고 접속했을 때를 의미합니다. Regular Expression은 어려운 내용입니다. 이는 차차 하나씩 배워보는 것으로 하겠습니다. + 이동할 함수 say.views.sayhello 라고 적었습니다. 이는 say 라는 App 안에 있는 views 모듈 안에 있는 sayhello 라는 함수를 실행하라는 의미입니다. 6. Views 우리가 위에서 설정한 sayhello 라는 함수를 드디어 작성할 때입니다. 아래와 같이 작성합니다. from django.http import HttpResponse def sayhello(request): return HttpResponse('<h1>Hello, World!</h1>') 1) fromdjango.http import HttpResponse Django에서 기본적으로 제공해주는 HttpResponse 클래스를 사용하겠다는 뜻입니다. 그런데 그 클래스는 django라는 패키지안의 http라는 모듈안에 있습니다. 이 클래스는 사용자에게 보여주 길 원하는 내용을 Http라는 프로토콜을 이용해 보여주는 기능을 합니다. 이는 공식문서에서 확인할 수 있습니다. 2
  • 14. 2) sayhello 함수 + request def sayhello(request): 웹 어플리케이션은 항상 request 객체를 갖고 돌아다닙니다. 그렇기 때문에 urls.py를 이용해 실 행되는 sayhello라는 함수의 인자값으로 request라는 객체를 넣어준 것입니다. 넣어주지 않으면 에러가 나니 꼭 써야합니다. + return def sayhello(request): return HttpResponse('<h1>Hello, World!</h1>') urls.py를 통해 sayhello 함수를 호출하였기 때문에 이 호출에 대해 반응을 해줄 필요가 있습니다. 여기서는 함수의 return으로 특정값을 반환해주고 있습니다. 그런데 그 값이 <h1>Hello, World!</h1> 라는 인자값을 갖고 HttpResponse 클래스를 통해서 만들어진 내용입니다. 7. 웹서버 구동 및 확인 자, 이제 다 되었습니다. 이제는 웹서버를 구동하여 확인해보도록 하겠습니다. 가상 환경에서 아 래와 같이 입력하여 웹서버를 실행합니다. $ python manage.py runserver 192.168.10.10:8000 그리고 로컬 컴퓨터의 웹브라우저를 통해 192.168.10.10:8000 를 입력해 접속해봅니다. 아래 와 같이 나오면 성공한 것입니다.
  • 15. [Figure 11. Hello, World! 정상 작동화면] 제가 졸면서 만드는 바람에 위 그림에 스펠링이 틀렸네요^^;;; 지금까지 Django를 이용해 말도 안되게 간단한 웹 어플리케이션을 만들어 보았습니다. MTV 패 턴에만 익숙해진다면 쉽게 만들 수 있을 것입니다. 그래서 Django와 MTV 패턴에 익숙해질 수 있 도록 아래에 다른 예제를 만들어 보겠습니다. 2. Django Example: Simple Calculator
  • 16. [Figure 12. Simple Calculator] 위 그림과 같이 Django를 이용해 간단한 계산기 웹 어플리케이션을 만들어보겠습니다. 계산한 결 과에 대해 DB에 저장하는 것은 다루지 않겠습니다. 이 예제의 학습 목적은 아래와 같습니다. 1. Django의 MTV 패턴 학습으로 Django와 익숙해지기 2. Template 개념의 이해 3. Web 기초 1. Request/Response의 이해 2. Form 태그의 이해 2.1 Project & App 만들기 1) Project 생성 Django로 웹 어플리케이션을 만들게되면 처음으로 하게되는 것은 Project를 만드는 것입니다. $ django-admin.py startproject calculator 2) App 생성
  • 17. 그리고 Project 디렉토리로 이동해 App을 만들겠습니다. $ cd calculator $ django-admin.py startapp cal Project와 App을 만드는 것은 익숙해지셔야 합니다. 지울 땐 그냥 디렉토리 또는 파일을 지우시면 됩니다. 특별한 명령어는 필요없습니다. 3) settings.py 설정 위에서 생성한 App을 settings.py 에 넣어줘야 App을 인식합니다. 아래와 같이 입력합니다. INSTALLED_APPS = ( 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'cal', # 추가 ) 2.2 URL 이제는 사용자가 웹 페이지를 요청할 때 처음으로 처리해주는 URL 부분을 작성해 보겠습니다. 사 용자가 어떤 URL 주소로 들어왔는지 파악한 후 해당 함수(기능)으로 이어주는 부분입니다. 우리는 만약 사용자가 주소/cal 라는 경로로 접근했을 때 cal App 안에 있는 views 모듈의 calculate 함수를 이어주겠습니다. from django.conf.urls import patterns, include, url from django.contrib import admin urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^cal/$', 'cal.views.calculate', name='calculate') # 추가 )
  • 18. 1) admin Django고 편리한 것중에 하나는 Admin 페이지를 제공한다는 것입니다. 이 부분은 나중에 공부하 도록 하겠습니다. 2) patterns 함수 이 함수는 django.conf.urls 안에 있습니다. 우리가 pip으로 설치한 Django가 어딨었는지 기 억나시나요? 한 번 직접 patterns 함수가 어떻게 만들어져있는지 살펴보도록 하겠습니다. def patterns(prefix, *args): pattern_list = [] for t in args: if isinstance(t, (list, tuple)): t = url(prefix=prefix, *t) elif isinstance(t, RegexURLPattern): t.add_prefix(prefix) pattern_list.append(t) return pattern_list 일단 무슨 말인지 어렵습니다. 하하. 하지만 어려운 건 보지 마시고 나중에 익숙해지면 천천히 보 이실 겁니다. + 인자 인자 혹은 argument라고 부릅니다. 또는 parameter라고도 부릅니다. patterns라는 함수는 인자 로 아래와 같은 값을 받습니다. 1. prefix: URL의 접미어 2. *args: URL 패턴 patterns 함수는 URL 주소에 대한 패턴을 만들어주는 역할을 합니다. 여기에서 prefix 는 URL 주소의 접미어를 인자값으로 받겠다는 뜻이며, *args 는 그 외에 인자값을 뜻합니다. 즉, * 라는 것은 인자값을 다수를 뜻하고 args 는 임의로 써넣은 변수명일뿐입니다. 하지만 Python에서는 관례적인 표현으로 *args 라고 쓰곤 합니다.
  • 19. + 함수 내용 patterns 함수 안을 들여다 보면 인자값( *args )을 받아와서 pattern_list 라는 list에 조건에 맞 춰 받아온 인자값( *args )을 append(list에 추가)하는 것을 볼 수 있습니다. 조건은 아래와 같습니 다. 1. 받아온 인자값이 1. list or tuple일 때 2. Regular Express 형태의 URL 패턴일 때 위와 같은 조건일 때 각기 다른 행동을 하는 것을 볼 수 있습니다만, 우리는 더 깊게 보지 않고 우선 은 여기까지 보겠습니다. 다만 중요한 것은 첫 번째 인자값으로 URL의 접미어, 두 번째 인자값으로 URL 패턴을 받는다는 것을 알아야 합니다. 3) url 함수 위에서 살펴본 patterns 함수안에 두 번째부터의 인자값으로 url함수를 사용해 입력하고 있습니 다. 이 함수도 한 번 소스를 살펴보겠습니다. django.conf.urls 안에 있습니다. def url(regex, view, kwargs=None, name=None, prefix=''): if isinstance(view, (list, tuple)): # For include(...) processing. urlconf_module, app_name, namespace = view return RegexURLResolver(regex, urlconf_module, kwargs, app_name=app_name, namespace=namespace) else: if isinstance(view, six.string_types): if not view: raise ImproperlyConfigured('Empty URL pattern view name not permitted (for pattern %r)' % regex) if prefix: view = prefix + '.' + view return RegexURLPattern(regex, view, kwargs, name) 함수를 볼 때 처음으로 보는 것은 역시 인자값입니다. 함수 안에 있는 내용은 지금은 복잡하니 보 지 않겠습니다. + 인자 인자로 받는 값은 총 5개입니다.
  • 20. 1. regex 2. view 3. kwargs=None 4. name=None 5. prefix=” 첫 번째 인자값은 Regular Express 즉, 정규표현식입니다. 정규표현식으로 입력한 URL 주소값을 받습니다. 두 번째 인자값은 view입니다. 즉, views.py 안에 있는 함수를 인자값으로 받습니다. 세 번째 인자값부터는 이상하게 변수에 할당하는 모습처럼 보입니다. 이것을 키워드 인자 혹은 Keyword Argument라고 부릅니다. 이 키워드 인자값은 순서를 상관하지 않습니다. 해당 키워드 만 매칭이 되면 해당 값을 찾을 수 있거든요. kwargs와 name은 default 값으로 None이 들어가 있습니다. prefix의 경우엔 “(빈 값)이 들어가 있습니다. 여기서 눈여겨 볼 것은 regex, view, name입니다. urlpatterns = patterns('', url(r'^admin/', include(admin.site.urls)), url(r'^cal/$', 'cal.views.calculate', name='calculate') # 추가 ) 1. regex: r'^cal/$' 2. view: 'cal.views.calculate' 3. name: 'calculate' regex 정규표현식 r'^cal/$' 은 사용자가 호스트주소/cal 으로 접속했을 때를 말합니다. 여기서 정 규표현식 ^은 시작을 의미하며 $은 끝을 의미합니다. 정규표현식은 공부할 게 많아 여기서는 깊게 다루지 않겠습니다. 보통 패스워드를 입력할 때 대소문자와 숫자가 있어야한다 와 같은 규칙을 사 용할 때 쓰입니다. view cal App 안에 있는 views 모듈의 calculate 함수를 실행하라는 의미입니다. 이를 보통은 view 함수라고 말합니다. name 이 URL 패턴의 이름을 뜻합니다. 이는 유용하게 사용됩니다. 우리는 좀 있다 보게 될 Template 문 서에서 이 name을 사용하게 될 것입니다.
  • 21. 2.3 VIEW 1) 로직 이제 URL을 작성했으니 다음으로는 판도라의 상자, views.py 에 함수를 작성해 보겠습니다. 여 기서 사용자에게 숫자값을 입력받아 더하기, 빼기, 곱하기, 나누기 연산을 구현해 보겠습니다. 로직은 아래와 같습니다. 1. 사용자의 요청(request) 방식(method)이 GET 이면 1. 아무것도 하지 않고 calculate.html 템플릿 파일을 렌더링해 보여줍니다. 2. 사용자의 요청(request) 방식(method)이 POST 이면 1. 사용자가 입력한 number1 값을 number1이라는 변수에 저장합니다. 2. 사용자가 입력한 number2 값을 number2이라는 변수에 저장합니다. 3. 사용자가 지정한 연산자를 operation이라는 변수에 저장합니다. 4. 만약 operation이라는 변수 값이 1. plus 이면 더하기 연산을 해 결과를 result 변수에 할당합니다. 2. minus 이면 빼기 연산을 해 결과를 result 변수에 할당합니다. 3. multiply 이면 곱하기 연산을 해 결과를 result 변수에 할당합니다. 4. divide 이면 나누기 연산을 해 결과를 result 변수에 할당합니다. 3. 연산 결과값인 result 변수를 렌더링하여(render) calculate.html 템플릿 파일에 request 와 함께 보냅니다. 2) 템플릿 파일 위의 로직을 Python으로 기술하면 아래와 같습니다. # coding: UTF-8 from django.shortcuts import render def calculate(request): """ 사용자로부터 값을 입력받아 계산하는 함수 """ result = "" if request.method == "GET":
  • 22. pass elif request.method == "POST": number1 = int(request.POST['number1']) number2 = int(request.POST['number2']) operation = request.POST['operation'] if operation == "plus": result = number1 + number2 elif operation == "minus": result = number1 - number2 elif operation == "multiply": result = number1 * number2 elif operation == "divide": result = number1 / number2 else: result = "Nonthing" return render(request, 'calculate.html', { 'result': result, }) 3) GET일 때와 POST일 떄로 나누는 이유 한 페이지에서 사용자가 값을 입력할 수 있는 양식을 보여주기도 하고(GET) 사용자가 입력한 값을 가져오기도(POST) 하기 때문입니다. 그렇기 때문에 사용자가 어떤 방식으로 접근했느냐에 따라 사용자가 값을 입력할 수 있도록 폼 양식을 보여주거나, 사용자가 값을 입력해 계산 버튼을 눌렀을 경우이거나 두 가지로 나누는 것입니다. 4) render 함수 이렇게 결과값을 result 라는 변수에 저장하고 나서 이를 calculate.html 템플릿 파일에 반 환해줘야 합니다. 이럴 때 쓰는 함수가 render 함수입니다. 이는 템플릿 파일에 보낼 값들 (Context)을 렌더링해주는 역할을 합니다. 이 함수의 인자값은 아래와 같습니다. 1. request 2. 템플릿 파일: 'calculate.html' 3. 템플릿 파일에 넘겨줄 값: {'result': result} render 함수의 첫 번째 인자값은 항상 request 객체입니다. 두 번째부터는 순서에 상관없지만 보 통은 두 번째로 템플릿 파일을 세 번째로 넘겨줄 값을 사전형 객체로 적어줍니다. 사전형 객체의
  • 23. key가 템플릿에서 사용하게 될 객체가 됩니다. 2.4 TEMPLATE View 함수를 작성했으니 이제는 사용자가 계산하고 싶은 값을 입력받을 UI인 Template을 만들 차 례입니다. 이 Template 파일에는 사용자가 값을 입력하고 계산 결과값도 보여줍니다. 하지만 코 딩을 하기 전에 템플릿을 사용하기 위한 세팅을 해야 합니다. 1) Template이 저장될 디렉토리 만들기 먼저 우리가 만들 calculate.html 파일이 저장될 디렉토리를 만들겠습니다. 프로젝트 최상위 경로에서 아래오 같이 실행합니다. $ mkdir templates 디렉토리 이름은 아무거나 입력해도 상관없지만 여기서는 templates 라고 하겠습니다. 2) Template을 사용하겠다고 세팅하기 우리는 이제 template을 사용하겠다고 세팅을 해줘야 합니다. settings.py 에 아래와 같이 입 력합니다. # Build paths inside the project like this: os.path.join(BASE_DIR, ...) import os BASE_DIR = os.path.dirname(os.path.dirname(__file__)) TEMPLATE_DIRS = (os.path.join(BASE_DIR, 'templates'),) # 추가 위에 작성한 것처럼 TEMPLATE_DIRS 라는 변수에 값을 넣어주는 것입니다. 문서 어디에 넣어도 상관없습니다. 단, TEMPLATE_DIRS 에 BASE_DIR 이라는 변수를 사용하고 있기 때문에 BASE_DIR 이라는 변수 위에 입력해서는 안됩니다. 그래서 일부러 BASE_DIR 변수 바로 아래 부분에 입력해 놓았습니다. (os.path.join(BASE_DIR, 'templates'),) 의 의미는 BASE_DIR 이라는 프로젝트 최상
  • 24. 위 경로가 들어가 있는 변수에 우리가 새로 만든 디렉토리인 templates 를 join (조인) 하겠다 는 뜻입니다. 즉 우리가 만든 디렉토리 경로를 TEMPLATE_DIRS 에 할당해준 것뿐입니다. 3) Template 파일에서 request 객체를 사용하겠다고 세 팅하기 settings.py 파일에 아래 부분을 아무곳에나 입력해 줍니다. TEMPLATE_CONTEXT_PROCESSORS = ( "django.contrib.auth.context_processors.auth", "django.core.context_processors.debug", "django.core.context_processors.i18n", "django.core.context_processors.media", "django.core.context_processors.static", "django.core.context_processors.tz", "django.contrib.messages.context_processors.messages", 'django.core.context_processors.request', ) 이 부분은 Template Context Processor 즉, 템플릿 컨텍스트 처리기라고 합니다. 템플릿 파일에 특정값(Context)을 보낼 때 일부 특수한 처리가 필요한 게 있습니다. 바로 그런 부분을 누가하는 지 써넣어준 것입니다. 이는 외울 필요가 전~혀~ 없습니다. 그냥 복사 붙여넣기 하시면 됩니다. 자세한 것은 공식 문서를 참고하시기 바랍니다. 4) template file 작성 아래와 같이 우리가 만들 calculate.html 을 작성하고 이를 templates 디렉토리에 저장합 니다. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Simple Calculator Using Django</title> </head> <body>
  • 25. <h1>Simple Calculator Using Django</h1> <form action="{% url 'calculate' %}" method="post"> {% csrf_token %} <p> <label for="number1">숫자1 :</label> <input type="number" name="number1" value="0"> </p> <p> <label for="number2">숫자2 :</label> <input type="number" name="number2" value="0"> </p> <p> <select name="operation"> <option value="plus">+</option> <option value="minus">-</option> <option value="multiply">x</option> <option value="divide">/</option> </select> <input type="text" name="result" value="{{ result }}" disabled> </p> <p> <button type="submit" name="submit">계산하기</button> </p> </form> </body> </html> + Form태그 우리가 중요하게 살펴볼 태그입니다. <form action="{% url 'calculate' %}" method="post"> form 태그 안에 중요한 속성 두 가지가 있습니다. 1. action: 전송(submit) 버튼을 눌렀을 때 데이터를 어디로 보내줄 것인지
  • 26. 2. method: 전송 방식은 어떤 것인지 (GET or POST) GET 방식은 엽서로 생각하시면 편합니다. 누가, 누구에게, 어떤 내용으로라는 정보가 다 보이지 요. POST 방식은 봉투에 동봉된 편지라고 생각하면 됩니다. 그 안에 들어가 있는 정보가 보이지 않지요. 이 방식은 사용자가 요청(request)했을 때의 방식입니다. 이 부분은 깊게 들어가지 않고 여기까지만 보겠지만 일반적으로 데이터를 주고 받을 때 POST 방식을 사용한다고 생각하시면 됩 니다. + {% .. %} 이 것은 무엇일까요. 바로 Django에서 제공하는 Template Language 표현 방식입니다. 표현 방 식에는 두 가지가 있습니다. 1. Template tag: {% %} 2. Template variable: {{ }} + {% url ‘calculate’ %} Django에서 제공하는 템플릿 언어중에 url이라는 함수를 이용하는 것입니다. 템플릿 언어의 양식 은 함수에 인자값을 넣을 때 함수 한 칸 띄고 인자값을 입력해주면 됩니다. 즉 calculate 라는 이 름을 가진 URL주소를 반환해줍니다. 생각나시나요? calculate 라는 URL 이름을 어디서 작성했었나요? 바로 urls.py 에서 작성했 었습니다. 즉 반환값은 호스트주소/cal 이 될 것입니다. 전송 버튼을 누를 때 POST 방식으로 이 URL로 접속을 하면 다시 cal.views.calculate 함수를 실행하게 되고, 이 때 request (요청) 방식(method)은 POST 방식이기 때문에 calculate 함수 안에 request.method 가 POST 일 때 조건의 아랫부분을 실행하게 되는 것입니다. + {% csrf_token %} CSRF는 Cross-Site Request Forgery를 말합니다. CSRF는 웹 취약점 공격으로 희생자가 자신의 의지와는 무관하게 해커가 의도한 행위 (수정, 삭제, 생성 등)를 특정 웹 사이트에 요청하는 공격입 니다. 그런데 Django는 이런 공격을 막아줄 수 있는 보안처리를 이미 마련해주고 있습니다. 바로 csrf_token입니다. 이는 꼭 Form 태그 아래에 써줘야하며 이를 써주지 않으면 바로 에러가 나니 유의하시기 바랍니다. + {{ result }} <input type="text" name="result" value="{{ result }}" disabled>
  • 27. 우리가 views.py 에서 연산을 하고 나온 결과값을 result라는 변수에 넣어주었습니다. 그리고 그것은 템플릿 파일에 넘겨줄 때 result라는 이름으로 넘겨주었습니다. 그 때 넘겨준 이름을 템플 릿 변수에 넣어주면 해당 값이 출력됩니다. 3. Summary 우리는 이번 챕터에 아주 간단한 예제 2개를 통해 Django를 공부하였습니다. 드디어 MTV 패턴의 템플릿도 해보았습니다. 다다음 챕터에는 모델을 다뤄보도록 하겠습니다. 실제로 처음이라 어려웠을 수도 있습니다. 각자 로컬 컴퓨터에서 지우고 다시 만들어보고 실패해 보고 에러내보고 성공해보고, 시행착오를 거치길 권장합니다. 에러를 많이 보는 것이 학습의 지름 길이라 생각합니다. Written by initialkommit@Study-Bee. 1. http://www.zachariahrosenberg.com/ 2. https://docs.djangoproject.com/en/1.7/topics/http/urls/#syntax-of-the-urlpatterns- variable