11강 Static 설정 및 CSS 파일 분리

• 보통 디자인적인 요소(ex-style태그) 등은 CSS파일로 따로 관리함

• static. 정적으로 자주 바뀌지 않는 파일. 앱별로 따로 관리하게 할 것임

• 1. STATIC_ROOT = ‘staticfiles’

     root 지정. collectstatic하면 static파일들이 루트로 모이게됨.

     #settings.py에 추가
     STATIC_ROOT = os.path.join(BASE_DIR,'staticfiles')

     os : 라이브러리

     path:경로관련 모듈

     join : 합친다, function

     BASE_DIR : 이 폴더 경로를 BASE_DIR로 하겠다.

     

• 2. static디렉터리 생성

     특정 앱에 종속되어있지 않은( 프로젝트 전체에서 관리할 수 있는) static 파일을 만들 것임

     STATICFILES가 보통 앱 내부에 있는 staticfiles를 찾는데 임의적으로 우리가 앱에 종속적이지 않은 staticfiles를 만들어 줄수 있음

• 3. base.css 파일 생성

     class를 이용하여 작성

     #base.html
     .pragmatic_footer_logo{
         font-family: 'Lobster', cursive;
     }
     
     #footer.html
     <h6 class="pragmatic_footer_logo">Pragmatic</h6>

• 4. head.html에 static파일 가져오도록 설정

     {% load static %} 이 있어야 static 구문 사용가능

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

     base.css 필요한 경로를 알아서 가져와줌 → 전체 템플릿에서 사용 가능

     href="{% static 'base.css' %} 자동적으로 django가 스태틱파일 경로로 바꿔줌

     href= ‘/static/base.css’

💡 계속 적용이 안 되어서 어디서 문제일까 했는데 STATICFILES_DIRS 설정을 빼먹었다. STATIC_DIRS로 설정해놨음..

STATIC_URL = '/static/'

STATIC_ROOT = os.path.join(BASE_DIR,'staticfiles')

STATICFILES_DIRS=[
    BASE_DIR/ "static",
]