본문 바로가기

WEB/Django

Django 입문, 한줄한줄 따라하기!! (1)

나는 인공지능 개발자다. 맨날 pytorch로 자연어처리, GAN 모델들만 개발해왔다.

근데 정작 이모델들을 서비스하려고 하면 어?? 어쩌지??? 하면서 전혀 감이 안 왔다.

내가 할 줄 아는 거라고는 문장/이미지를 입력으로 줬을 때 json 포맷의 결과뿐이니까

물론 인공지능 개발팀과 서비스팀이 각각 존재해야 하는 게 맞다. 

그러나..... 현실은따로 서비스팀이 없기 때문에 직접 해봐야겠다 싶어 시작했는데 헬게이트가 열렸다.....

웹/앱/서버에 대한 지식이 없이 뭐부터 해야 하는지 전혀 감이 안 왔다.

그래서 이래저래 많이 알아보다 보니

React/Bootstrap 등등으로 Front-end를 만들고

서버에 Flask or Django로 Back-end를 구축하고 웹을 연결하고 등등 어마 무시한 일이 있다는 걸 알았다!!!!!!

또 Flask나 Django도 비동기, 멀티스레드/프로세스를 하려면 Gunicorn, Celery, Nginx 등등 주렁주렁 달아야 할게 많았다.

어디서부터 뭘 시작해야 하나 갑갑해하다가 https://www.youtube.com/playlist?list=PLvX6vpRszMkwECdbxNX8s9R-vcUFGqqtC 에서웹을 만들고 사진을 업로드 후 opencv로 처리해서 다시 보여주는 강좌가 있었다.

 

이걸 따라 해보려 한다. 근데 장고에 대해 알고 가기 위해 공부를 시작했다!

 

 

Django!!!

장고 교육자료 : tutorial.djangogirls.org와 https://developer.mozilla.org/ko/docs/Learn/Server-side/Django/Introduction 에 장고 교육자료가 좋다. 최고!! 이 튜토리얼을 한줄한줄 따라 해 보겠다ㅎㅎ

 

Django(장고)는 파이썬으로 100% 작성된 web framework이다. 아래는 장고 영화 포스터다 ㅎㅎ

보안이 우수하고 유지보수가 편리한 웹사이트를 빠르게 개발할 수 있도록 도와주는 웹 프레임워크다.

무료 오픈소스고 커뮤니티가 활발하여 참고할 수 있는 자료가 많다. 신문 웹사이트를 만들던 팀이 여러 사이트들을 만들면서 계속 공통 코드와 설계를 반복하다가 이거 이거 안 되겠는데? 하고 만들어졌다고 한다.

 

장고 영화 포스터

Django의 구조 : MVT(Model View Template)

장고는 Model, View, Template로 구성되며 아래와 같다. 예시를 들며 설명했는데 진지하게 파고들진 말자 ㅎㅎ

 

 

1. 웹사이트의 웹 애플리케이션은 외부(웹브라우저, 클라이언트)로 부터 HTTP 요청(request)을 기다리고 있다.

    - 백화점 안내데스크에서 손님을 기다리고 있듯이

 

2. URLs : 요청을 알맞은 view에 보낸다(urls.py)

    - 손님이 와서 뭐라 뭐라 얘기하면 무엇을 원하는지 이해하는 과정

 

    - 요청(Request)을 받으면 웹 애플리케이션은 URL의 POST/GET 데이터로 요구사항을 알아낸다.

    - URL mapper는 요청 URL을 기준으로 HTTP 요청을 적절한 view로 보내준다.

       - urls.py에 저장, 아래와 같이 조건에 맞는 URL 패턴과 일치하는 HTTP 요청이 들어오면 View 함수에 요청을 전달

 

urlpatterns = [
    path('admin/', admin.site.urls),
    path('book/<int:id>/', views.book_detail, name='book_detail'),
    path('catalog/', include('catalog.urls')),
    re_path(r'^([0-9]+)/$', views.best),
]

 

3. View : 요청을 처리한다(views.py)

    - 손님이 문의한 내용을 알아본다.

    - 요청을 이해한 후 DB에 정보를 read/write 하거나 다른 작업을 수행한다.

    - view는 HTTP 요청을 수신하고 HTTP 응답을 반환하는 요청 처리 함수입니다. View는 Model을 통해 요청을 충족시키는 데 필요한 데이터에 접근합니다. 그리고 탬플릿에게 응답의 서식 설정을 맡깁니다.

    - 아래 코드는 예시이다. request가 들어오면 view 함수에서 'Hello from Django!'라는 글을 뱉어준다.

## filename: views.py (Django view functions)

from django.http import HttpResponse

def index(request):
    return HttpResponse('Hello from Django!')

 

4. Models : 데이터 모델 정의(models.py)

    - 백화점의 응대 매뉴얼 같은??? 비유가 좀 이상한데.....

    - 데이터 구조 정의, DB 기록 관리(CRUD, 추가 수정 삭제), 쿼리 하는 방법 제공하는 파이썬 객체

    - models라는 파이썬 객체로 데이터를 관리 밑 쿼리 수행

    - 그냥 가운데서 일처리 해주는 부분

 

 

. Templatess : 작업이 끝난 후 웹브라우저에 응답(Response)한다.

    - 처리 후 손님에게 결과를 알려준다. "환불은 10층입니다~~"라고 말로 하거나 손으로 10층을 알려주던가

    - 데이터 렌더링 하기(with HTML 템플릿들)

    - 보여주기 위해 HTML 같은 형식으로 파일의 구조나 레이아웃을 정의

    - View는 model에서 가져온 적절한 데이터를 HTML 템플릿을 이용하여 HTML 페이지를 만들어준다.

    - 꼭 html일 필요는 없다

 

 

 

자 그럼 에라 모르겠다. 냅다 따라 해 보자!!

 

1. 장고 설치

>> pip install django~=2.0.0

 

2. 장고 기본 골격 만들기

>> django-admin startproject mysite .

manage.py : 사이트 관리를 도와줌, 다른 설치 없이 컴퓨터에서 웹서버를 시작할 수 있음!

settings.py : 웹사이트 설정

urls.py      : urlresolver가 사용하는 패턴 목록 포함(우편배달부가 어느 곳으로 편지를 배달해야 하는지 판단 때 필요)

 

만들어진 기본 골격

 

3. 설정 변경

mysite/settings.py 에서 아래 변수들 변경

 

TIME_ZONE = 'Asia/Seoul'  # 정확한 현재시간 사용 위해

STATIC_URL = '/static/'      # CSS 다룰 때 정적 파일 경로 추가

STATIC_ROOT = os.path.join(BASE_DIR, 'static')  # ROOT 경로 그냥 생성, 나중에 편히 쓰려고

ALLOWED_HOSTS = ['127.0.0.1', '.pythonanywhere.com']  # PythonAnywhere 녀석들과 자기 자신만 허용 가능!

 

4. 데이터베이스 설정

장고로 운영하는 사이트 내 데이터 저장을 위해 데이터베이스를 설치하자

DB의 종류는 많지만 장고는 sqlite3이 기본으로 설치돼있다

mysite/settings.py에서

 

DATABASES = {

    'default': {

        'ENGINE''django.db.backends.sqlite3',

        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),

    }

}

 

데이터베이스 생성을 위해 아래 명령어를 수행하자 1초 만에 만들어진다 ㅎㅎ

>> python manage.py migrate

 

5. 웹서버 시작

인쟈 준비가 끝났다 냅다 시작해보자!!

>> python manage.py runserver

127.0.0.1의 8000번 포트에서 잘 시작됐다고 나온다. Ctrl-C를 누르면 종료된다

 

 

그럼 웹에서 127.0.0.1:8000을 접속하면 아래와 같은 화면이 나온다. 성공~!

 

 

 

Reference

tutorial.djangogirls.org

developer.mozilla.org/ko/docs/Learn/Server-side/Django/Introduction