[Django] Local 서버에서 정적 파일과 미디어 파일을 처리

정적 파일 구성

- django 프로젝트의 루트 디렉터리에 static이라는 새 디렉터리를 생성

mkdir static​

 

- static 디렉터리 내에 css, js, images 등 정적 파일 유형에 따른 하위 디렉터리 생성

정적파일 폴더구성

- css 폴더에 style.css 생성 후 아래 코드 작성

/* static/css/style.css */

body {
  background-color: #f2f2f2;
}

h1 {
  color: #333;
  font-size: 24px;
}

h2 {
  color: #290993;
  font-size: 18px;
}

p {
  color: #777777;
  font-size: 14px;
}

 

---

코드 수정

- Django 프로젝트의 settings.py -> STATIC_URL 부분 다음과 같이 수정

STATIC_URL = 'static/'

# In local server,
STATICFILES_DIRS = [
    BASE_DIR / 'static',
]​

- html 템플릿에 style.css 적용

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

<h2>책 생성하기</h2>
...​

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

<h2>책 목록</h2>
...​

---

적용 확인

http://localhost:8000/static/css/style.css 로 접속하여 style.css 적용 확인

 

http://127.0.0.1:8000/myapp/create/ 로 접속하여 css 적용 확인