3 minute read

템플릿

정적(static)파일

웹 페이지를 렌더링 하는 과정에서 필요한 추가적인 파일을 말한다.
CSS, JS, PNG, FONT등을 파일을 말한다.
정적 파일을 관리하는 디렉토리 구조는
앱 - static - 앱이름 - 여기에 css디렉토리, fonts디렉토리 등을 만들어 관리한다.

static에 있는 정적 파일을 현재 템플릿 파일에서 사용한다고 알려줘야한다.
가장 상단에 {% load static %} 을 작성해주면 된다. 이것을 템플릿 태그라고 한다.

정적 파일을 사용할 부분에서는 {% static ‘앱이름/폴더이름/정적파일’ %} 이렇게 쓰면 된다.

템플릿과 스테틱의 폴더 구조

템플릿과 스태틱은
앱 이름 - template - 앱 이름 - html파일
앱 이름 - static - 앱 이름 - 정적파일
이렇게 샌드위치 구조를 하고 있는데 템플릿 폴더 아래에 바로 파일을 작성하게 되면 문제가 생기기 때문이다.

settings.py에 templates에 ‘APP_DIRS’: True 가 돼있으면 각각의 앱에 템플릿 폴더가 있으니 템플릿을 찾을 땐 거기서 찾으라는 뜻이다.
settings.py에 installed_apps에 작성된 순서대로 찾게 되어서 파일이름이 같을 때 installed_apps순서상 뒤에 있으면 그 파일을 쓸 수 없게 된다.

스테틱은 배포할 때에 파일이름이 같으면 문제가 생기기 때문에 샌드위치 구조를 쓴다.

즉 샌드위치 구조는 모듈화를 위함이다.
샌드위치 구조를 쓰지 않으면 모든 파일명이 중복되지 않아야 하지만 샌드위치 구조를 사용하면 파일명이 중복돼도 다른 폴더 아래에 있으니 상관이 없다.

템플릿 언어

html문서를 작성할 때 프로그래밍 구조와 비슷한 기능을 제공한다.

  • 템플릿 변수
    지정한 데이터로 변환
    {{변수명}}
    view에서 넘겨 받은 값으로 변환된다.
    {{변수명.속성}}
    템플릿 변수 내부 속성에 접근할 때 사용된다.

  • 템플릿 태그
    템플릿 작성에 로직을 사용
    {% 태그 %} {% end태그 %}

  • 템플릿 필터
    템플릿 변수를 특정 형식으로 변환
    {{변수명|필터}}

  • 템플릿 주석
    템플릿 언어의 주석처리를 담당
    {# 주석 #}

템플릿 상속

고정되는 부분은 부모로 만들고 변하는 부분을 자식으로 만들면 더 효율적으로 코드를 작성할 수 있다.

  • 부모
    {% block 블록이름 %}
    {% extends 블록이름 %}
    이렇게 자식으로 넘겨줄 부분을 생성한다.
  • 자식 자식은 가장 윗줄에 {% extends ‘./base.html’ %} 이것을 작성해 상속받았음을 알린다.
    {% block 블록이름 %}
    {% extends 블록이름 %}
    이 블록안에 내용을 작성하면 된다.

만약 부모에서 블록에 내용을 작성했다면 자식에서 블록을 작성하지 않았을 때 부모에서 작성한 내용이 사용된다.

동적 페이지

뷰에서 데이터를 가공한다.
뷰에서 템플릿으로 데이터를 넘길 때 사전에 담아 render함수의 세번째 파라미터로 보낸다.
뷰에서 넘겨받은 값은 템플릿 변수로 사용한다.

우아한 URL

일정한 패턴을 가지고 입력하는 URL에 대해서 동적 URL을 지원한다.

urlpatterns = [
    path('index/', views.index),
    path('menu/<str:food>/', views.food_detail),
]

menu뒤에 오는 문자열을 food변수에 담아 views.food_detail로 함께 전달한다.

def food_detail(request, food):
    context = {"name":food}
    return render(request, 'foods/detail.html', context=context)

뷰에서 받을 때는 전달한 변수를 받기위해 인자를 두개 생성한다.
food를 사전에 담아 템플릿으로 넘겨준다.

URL은 경로 변수를 이용해 처리하고
View는 데이터 가공 후 템플릿으로 전달하고
Template는 템플릿 언어를 이용해서 데이터를 사용한다.

Path converters(경로 변수)

  • str : 경로 구분 기호(/)를 제외한 모든 문자열과 매칭된다.
  • int : 0 또는 양의 정수와 매칭된다.
  • slug : 문자, 숫자, 하이픈(-), 밑줄(_)로 구성된 문자열과 매칭된다.
  • path : 경로 구분 기호(/)를 포함한 모든 문자열과 매칭 된다.

get_static_prefix

템플릿 태그 안에 템플릿 변수를 중첩해서 사용할 수 없다.

뷰에서 넘겨받은 사전으로 템플릿 변수를 사용하려고
<img src={% static {{img_path}} %}/>
이렇게 시도하면 에러가 나게 된다.
장고에서는 이렇게 {% static ‘’ %}템플릿 태그안에
{{img_path}}템플릿 변수를 중첩할 수 없다.

이럴 때 {% get_static_prefix %}템플릿 태그를 사용하고 그 다음에 템플릿 변수를 사용하면 된다.
<img src={% get_static_prefix %}{{img_path}}/>

에러 페이지 처리

상태코드 - 요청에 대한 처리 결과가 어떻게 됐는지 알려주는 코드

  1. 1XX
    • 요청을 받아서 작업을 진행하고 있다는 뜻
    • 100
      요청의 첫 부분을 받아서 다음 요청을 기다리고 있다는 뜻
  2. 2XX
    • 요청 결과가 정상적으로 처리됐다는 뜻
    • 200
      정상일 때 받는 코드
    • 204
      정상 처리 됐지만 서버에서 보내줄 데이터가 없을 때
  3. 3XX
    • 요청을 완료하기 위해 추가적인 동작이 필요하다는 뜻
    • 301
      요청한 페이지가 새로운 주소로 옮겨졌다는 뜻
    • 304
      요청한 페이지가 마지막 요청이후 수정되지 않았다는 뜻
      이 때는 새로운 페이지를 만들지 않고 마지막으로 받았던 자원을 재사용 한다.
  4. 4XX
    • 클라이언트의 요청에 문제가 있다는 뜻
    • 404
      요청한 자원이 없다는 뜻
    • 403
      요청한 자원에 대한 접근 권한이 없다는 뜻
  5. 5XX
    • 서버가 요청을 처리하는 과정에서 문제가 발생했다는 뜻
    • 500
      서버 내부 오류를 의미한다.

상태코드

404

의도하지 않은 URL이 들어왔을 때 처리방법

from django.http import Http404

def food_detail(request, food):
    context = dict()
    if food == "chicken":
        context["name"] = "코딩에 빠진 닭"
        context["description"] = "가격 굿"
        context["price"] = 10000
        context["img_path"] = "foods/images/chicken.jpg"
    else:
        raise Http404("이런 음식은 없습니다!!!")
    return render(request, 'foods/detail.html', context=context)

raise Http404로 처리할 수 있다.

Tags:

Categories:

Updated:

Leave a comment