본문으로 바로가기

Django 웹사이트 개발 - 1

블로그에 있는 이것저것들 다 건드리다가 그만둔 느낌이라, Django 또한 마찬가지 일듯 싶지만, 노후대비 및 한가지 언어 개발 가능자가 되기 위하여, 하는 만큼까지 다시 포스팅할 예정.


책 '배프의 오지랖 파이썬 웹 프로그래밍' 을 통해 장고 개발에 손을 대려했으나, 생각보다 높은 난이도로 인해 패스트캠퍼스 '파이썬 웹개발 올 인원 패키지' 인강을 구매하여 수강중이나, 제일 기초 파이썬 강좌를 제외하고 강의의 퀄리티가 기대에 미치지 못하였다.

그래서 실제로 웹사이트를 제작하면서 책과 강의 및 장고걸스 튜토리얼 및 기타 블로그 등을 통해 제작시 필요한 것들을 체크하면서 포스팅하려고 한다.  

개발도구는 VS Code를 이용하며, Django를 이용한다. 현재 PC에 설치되어 있는 Python은 3.7.3 32-bit이며, vitualenv로 가상환경을 설정하여 개발한다.
(virtualenv를 추가적으로 설치를 했는지 기억이 안 나는데, 설치가 필요하다면 구글링을 통해 설치하면 될 것 같다.)


1. 프로젝트 만들기

일단 프로젝트 폴더를 생성하고 제목을 정한다.

이번 프로젝트 폴더는 'Consult_django'이며, 가상환경 폴더는 'consult_venv'로 설정하였다. 

가상환경 폴더 생성 후 해당 폴더 내 Scripts 폴더 하위의 activate.bat를 실행한다.
(Windows 기준이며, Mac 또는 리눅스 계열은 '가상폴더\bin\activate'를 실행하는 것으로 알고 있다.)

<가상 환경 폴더 생성 후 activate>

Activate 후에, pip3 install django 명령어를 통해 django를 설치해준다. 

<가상환경이 실행되면 명령줄 앞부분에 (가상폴더명)이 표시됨>

Django 설치 후 django-admin startproject '프로젝트명' (이 경우엔 'consult_web'로 설정함)을 통해 프로젝트를 생성한다.


Code 상에서 pylint 관련 설치 오류가 뜬다면, pip install pylint로 설치해준다.
그리고 Ctrl+',' 키를 눌러 설정창을 띄우고, json 검색 후, 'settings.json에서 편집'을 누르고 

    "python.linting.pylintArgs": [
        "--load-plugins=pylint_django"
    ]

를 추가해준다. 그래도 안되면 구글링을 통해 내용을 확인해보자.


<프로젝트 명을 'consult_web'으로 설정하여 생성, pylint 에러로 인해 pylint도 설치>

프로젝트 생성된 것을 왼쪽 탐색기에서 확인할 수 있고, 그 중 '해당프로젝트명\'해당프로젝트명\settings.py'에서 몇가지를 설정해준다. 해당 수정 사항은 장고걸스 튜토리얼 내 있는 내용을 스크린샷 떠서 가져왔으며, 해당 링크는 이미지 하단 설명에 써두었다.

< https://tutorial.djangogirls.org/ko/django_start_project/ >
< settings.py 수정>


  • 여기에서 어제 하루 종일 삽질한 내용을 적는다.
    STATIC_URL, STATIC_ROOT, STATICFILES_DIRS 이렇게 3가지다.
    (이 과정에서 프로젝트 생성 삭제를 반복하여 현재 프로젝트 명이 Sc_web으로 변경되었다.)

예전에 루비온레일즈를 통해 웹사이트를 만들어 볼 때, bootstrap이란걸 활용해 본 적이 있었고, 인강에서도 bootstrap 관련 내용이 있어서, 처음부터 bootstrap theme를 적용해놓고 진행하려고 했었는데, 적용이 안되는 문제가 있었다.

기본적으로 Django의 Static 폴더란 CSS, JS 같은 정적파일을 넣어두고 사용하는 폴더로, bootstrap 처럼 css 등을 적용할 때 해당 파일을 위치하는 곳이다.  

상단 장고걸스 튜토리얼에 'STATIC_ROOT' 설정으로 static 설정이 된 것인줄 알았는데, 아무리 해도 CSS가 적용되지 않아서 강의랑 책을 찾아봤더니, 'STATICFILES_DIRS' 설정을 하는 것으로 나와 있었다. 해당 폴더에 대한 장고 문서 설명은 다음과 같다. 

<https://docs.djangoproject.com/ko/3.0/ref/settings/>

기본적으로 STATIC_URL은 설정된 static_root 폴더('static' 폴더)를 url처럼 사용할수 있게 해주는 기능을 하는 것 같다. STATIC_ROOT를 설정하였을때, css, js 등의 파일들이 불러와지지 않아서, STATICFILES_DIRS를 설정하고 사용한 결과 제대로 로딩이 되는 것을 확인할 수 있었다. 검색 결과 두 폴더는 각각 겹치지 않도록 설정해야 한다고 한다.

Python manage.py collectstatic 명령어를 사용하면 여러 앱들의 static 파일(STATICFILES_DIRS에 설정된)들을 STATIC_ROOT로 모을 수 있으며, 단지 그 기능뿐인 것 같다.

<해당 index.html 테스트, test.css 내용은 다음과 같다. h1 a{color: #FCA205;}>

실제 양쪽의 CSS에 폰트 색깔만 다르게하여 테스트해본 결과 'STATICFILES_DIRS'에 있는 CSS파일만 적용이 되는 것을 확인하였다. DEBUG_MODE가 FALSE인 경우 어떤 CSS도 적용되지 않았는데, 구글링 결과 이 경우에는 runserver에서는 정적 파일을 처리하지 않는다고 한다. Apache등 외부 웹서버에서 별도로 설정하여 사용하는 것으로 판단된다.

STATIC_ROOT를 설정하지 않고 python manage.py collectstatic 명령어 사용시 에러가 발생한다.


이렇게 settings.py를 설정하고 터미널에서 'cd 프로젝트 폴더' 명령어를 통해 manage.py 파일이 있는 위치로 이동한 후, python manage.py migrate 명령어를 통해 기본 데이터베이스를 생성해주고, python manage.py createsuperuser 명령어를 통해 장고 기본 프로젝트 admin 페이지에 로그인 할 수 있는 관리자 계정을 생성해준다.

< 데이터베이스 migrate >

해당 경로에서 python manage.py runserver 명령어 입력 후, 웹 브라우저를 통해 127.0.0.1:8000 으로 접속했을 때 기본 장고 페이지가 보인다면 성공이다.

다음은 기본 model - view - html(templates) 간 어떻게 설정할 때 웹페이지가 보여지는 지에 대해서 포스팅할 예정이다.