[Django] 정적파일

목표

- Django에서 정적파일을 관리하는 방법을 알아본다.

 

지난 CRUD Operation에 대한 포스트에서 '정적 컨텐츠'란 말을 잠깐 한적이 있었다.

정적 컨텐츠는 웹 애플리케이션의 구성요소 중  웹 서버에 저장되어있는 html, css, image 파일 등과 같이 컨텐츠가 고정되어 사용자의 요청에 따라 변하지 않는 컨텐츠를 의미한다.

 

Django 에서는 이러한 정적 컨텐츠들을

프로젝트 디렉토리 내의 static 디렉토리에서 '프로젝트 단위'로 관리한다.

 

그럼 Django에서 정적 컨텐츠를 관리하는 방법을 알아보자

 

 

App 내의 static 디렉토리 생성

1) app 디렉터리(blog) 내에 static 디렉터리를 하나 생성

2) static 디렉터리 내에 css, js, img 디렉터리를 생성

3) 각 디렉터리 내에 임시로 파일을 하나씩 저장

 

 

settings.py 수정

STATIC_URL = '/static/'

# 관리할 앱 내의 static 디렉터리
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'blog', 'static')
]

# 루트 static 디렉터리
STATIC_ROOT = os.path.join(BASE_DIR, 'static')

 

 

collect

터미널에 다음을 입력

$ python3 manage.py collectstatic

 

static file 들이 복사되었다는 것을 확인할 수 있음

 

blog 디렉터리(app) 내의 static 디렉터리가 project 디렉터리 안으로 그대로 복사된 것을 확인할 수 있다.

 

static file load하기

Django에서 static 컨텐츠를 관리하는 방법을 알았으니, 실제 template에서 사용해보자

{% load static %}
<img src="{% static 'img/django.png'%}" width="150" alt="">

1) index.html 가장 상단에 '{% load static %}' 템플릿 태그를 적어준다.

어떤 템플릿에서 프로젝트에 저장된 정적 컨텐츠를 사용하기 위해서는 가장 상단에 항상 '{% load static %}'을 명시해주어야한다.

 

2) 불러올 파일의 path에 "{% static 'path' %}" 를 적는다.

프로젝트 단의 static 디렉터리를 root로 사용하고 그 안에서 사용할 파일의 path를 적어준다.

 

'django.png' 이미지가 잘 나오는 것을 확인할 수 있다.

 

이미지를 불러온 방법처럼 css나 js 파일도 같은 방식으로 불러올 수 있다.

<link rel="stylesheet" href="{% static 'css/style.css'%}">
<script src="{% static 'js/script.js'%}"></script>

 

프로젝트 단위로 정적 컨텐츠를 관리하기 때문에 특정 app에서 다른 app의 정적 컨텐츠도 사용할 수 있다.

특정 app의 정적컨텐츠를 생성, 수정, 삭제 했다면 바로바로 collect해서 프로젝트 단위로 관리할 수 있도록 하자