Writing your first Django app, part 6 - 1편

Django에서 정적 파일 사용하기

이번 튜토리얼은 part 5 에서 이어서 진행 합니다.

Web-poll 어플리케이션을 만들었고, 이제 stylesheet 과 이미지들을 추가해야 할때입니다.

서버에서 생성되는 HTML 파일 외에

웹 어플리케이션은 보통 이미지나, JavaScript 혹은 CSS 같은

추가적인 파일을 가져야 합니다.

이 파일들은 웹페이지를 완성할때 필요합니다.

Django에서는, 이 파일들을 “static files” 라고 불릅니다.

작은 프로젝트에는, 이게 아주 큰 문제가 되지 않습니다. 왜냐하면, static files 들은 웹서버 어딘가에 두고 웹서버가 찾게 하면 되기 때문입니다. 하지만, 큰 프로젝트들 - 특히 다수의 앱으로 구성되고 다중의 static files 들을 처리해야 할때가 오면 좀 어려워 집니다.

이것이 바로, django.contrib.staticfiles 가 하는 일입니다.

각 어플리케이션에서 정적파일들을 한곳에 모아서 놓아줍니다.

프로덕션 환경에서 쉽게 찾을수 있게 한곳에 모아서 관리 합니다.

App 의 느낌과 모양 정의하기

첫번째로, polls 폴더안에, static 폴더를 만듭니다. Django 는 정적파일들을 이 폴더에서 찾게 됩니다.

Django 가 템플릿들을 polls/templates/ 폴더에서 찾는 방식과 비슷하게 이루어 집니다.

Django 의 STATICFILES_FINDERS 세팅은 검색자의 리스트들을 포함하고 있습니다. Finders 즉 검색자들은 여러 곳에서 static files 들을 찾습니다.

기본값중 하나는, AppDirectoriesFinder 인데,

이것은, 각 INSTALLED_APPS 에 등록된 앱의 서브폴더인 ‘static’ 을 찾습니다. 위에 생성한 polls/static 같은 폴더를 의미 합니다. 장고의 관리자 페이지는 정적파일들을 찾기 위해, 위와 같은 구조의 폴더 구조를 사용합니다.

polls/static/polls/style.css 파일을 생성해 줍니다.

AppDirectoriesFinder 가 polls/styles.css 같은 정적파일들을 찾을수 있게

경로를 지정해 주는 것인데,

이 방식은 템플릿 경로를 설정해준 방식과 비슷합니다.

Static file namespacing

Static file namespacing

템플릿과 비슷하게, 우리는 정적파일들을 바로 polls/static 에 넣을수 있었을 겁니다.

하지만, 이것은 좋은 생각이 아닙니다. Django 는 static 이름과 매치되는 첫번째 static 파일을 찾습니다.

만약, 같은 이름의 정적파일이 다른 앱에 존재하면, Django 는 이 정적파일들을 구분할수 없을겁니다.

따라서, polls/static/polls/style.css 와 같이, poll 앱이 사용될 정적파일들을 담아놓습니다.

우리는 장고에게 정확한 정적파일들을 가르키게 해야하고, 최선의 방법은 namespacing (이름공간)을 두어서 구분 하는것입니다.

따라서, 정적파일들을 어플리케이션을 위한 폴더명 안에 넣어줍니다.

polls/static/polls/style.css 파일을 생성해 주고, 아래 내용을 추가해 줍니다.

1
2
3

li a{
    color: green;
}

staticfiles 읽어오기

정적 파일을 생성하였으니,

index.html 파일에서 이 정적파일들을 불러오게끔 해줘야 합니다. polls/templates/polls/index.html 파일을 열고,

{% load static %} 이라고 파일 상단에서 정적파일을 열어줍니다.
그리고나서, link 테그를 통해 해당 CSS 파일을 읽어줍니다. 

{% load static %}

<link rel="stylesheet" type="text/css" href="{% static 'polls/style.css' %}">

1
2

{% load static %} 템플릿 테그는 정적파일들의 절대경로의 URL 을 생성해줍니다. 
python manage.py runserver 를 실행 시켜서 정적파일이 잘 적용되었는지 확인 해봅니다.

브라우저를 열어서 http://localhost:8000/polls/ 로 접속해보면,

Stylesheet 이 잘 읽어져서, 질문 링크들이 Django 스타일인 초록색으로 표시가 됩니다.

마치며..

Django 페이지에 정적파일을 적용해 보았습니다.

이 정적파일 경로 설정을 유의깊게 보고 있다가, 앱마다 사용되는 정적파일들을 사용합시다.