터칭 데이터

장고(Django) 상세(detail) 페이지로의 링크 추가하기 본문

장고 (Django)

장고(Django) 상세(detail) 페이지로의 링크 추가하기

터칭 데이터 2023. 11. 3. 11:57

우리의 상세(detail)페이지 제작 단계는 크게 2가지였습니다.

 

1. URL에 Quetions ID를 입력시 해당 Question의 상세 페이지로 접속하도록 구현하기

2. question 제목들이 나열되어 있을 때 특정 제목을 클릭하면 해당 question의 상세페이지로 가는 링크 만들기

우리는 바로 이전 시간 1단계 구현을 마쳤습니다.

 

이번에는 2단계를 구현할 것입니다.

 

 

 

 

 

 

 

 

 

제목 클릭시 상세 페이지로 이동하는 링크 추가

 

 

 

제목을 클릭시

 

 

 

해당 제목의 상세 페이지로 이동했습니다.

 

 

 

 

<a>태그를 이용

 

뷰(polls/views.py)에서 context로 건네 받은 questions의 쿼리셋 요소들인 question에 반복문으로 하나씩 접근하면서 해당 question의 제목을 보여주는데 그 제목에 a 태그로 링크를 걸어 상세 페이지에 방문할 수 있도록 했습니다.

 

 

 

 

 

index 페이지에서 의도한대로 question의 제목들만 나열되고 링크가 걸려있습니다.

개발자 도구로 살펴봐도 a 태그에 ID가 링크로 잘 붙어 있습니다.

 

 

 

제목을 클릭하면

 

클릭한 question의 ID가 URL에 붙으며 해당 question의 상세페이지로 정상적으로 방문한 것을 볼 수 있습니다.

 

 

 

 

 

 

 

 

 

 

중요) URL 하드코딩 대신 URL 별칭과 네임스페이스 사용하기

 

URL 별칭과 네임스페이스

 

 

 

URL 별칭

 

우리가 index.html에서 작성한 코드를 다시 한번 살펴보겠습니다.

 

블록표시된 부분에서 /polls/question의id 같이 작성한 방식을 하드코딩 방식이라고 부릅니다.

 

하드코딩은 처음에 프로그래밍을 학습할 때 이해하기 쉽지만 나중에 프로젝트의 규모가 커지고 프로젝트와 앱의 파일들간의 관계도가 복잡해질 수록 관리가 매우 어려워지게 됩니다. 하드코딩 방식은 개발에 한계가 있다는 뜻입니다.

 

예를 들어 우리가 polls/question/id 혹은 polls/id/question과 같이 URL의 구조를 바꾸게 될 때 하드코딩으로 작성했다면 템플릿에서 사용한 URL들을 일일이 찾아가며 전부 수정해줘야합니다.

 

이런 문제를 예방하기 위해서는  해당 URL에 대한 실제 링크 대신 링크의 주소가 1:1 매핑되어 있는 별칭을 사용해야 한다.

 

그리고 실제 프로젝트에서 URL 리팩토링은 매우 빈번하게 일어납니다. 그러므로 URL 별칭은 반드시 숙지해야합니다.

 

 

 

그런데 우리는 사용하지 않았을 뿐 지금까지 URL의 별칭을 정의해왔습니다.

 

 

polls/urls.py에서 urlpatterns에서 path를 작성할 때마다 인자로 name 속성을 정의해줬던 걸 기억하시나요?

이때 우리가 정의했던 name이 바로 URL의 별칭입니다. 위 이미지에서는 빨간색 박스의 "index"와 'detail'이 URL 별칭입니다.

 

우리는 

http://127.0.0.1:8000/polls/ 와 같은 Question 최근 목록 URL에는 index라는 별칭

http://127.0.0.1:8000/polls/2 와 같은 상세 페이지 URL에는 detail이라는 별칭을 준 것입니다.

 

 

 

 

index.html 템플릿에서 detail 별칭을 사용해봅시다.

 

 

a 태그의 href에 아까의 하드코딩과 달리 제어문을 감싸는 {% %}를 사용했습니다.

{% url "detail" question.id %}를 살펴보고 해석하면

URL 별칭이 detail인 URL은 question.id라는 인자가 필요하니 이를 전달하라는 뜻입니다.

 

 

 

우리가 URL 별칭을 정의해준 polls/urls.py를 다시 살펴보면

 

detail 별칭을 쓰는 URL은 http://127.0.0.1:8000/polls/숫자 형태이고 숫자 question_id를 필요로 합니다.

 

우리는 URL에 별칭 설정과 만일 그 별칭의 URL이 필요한 인자(여기서는 question_id)가 있다면 어떻게 전달해 사용하는지 템플릿에 {% url ~ %}를 작성하며 살펴보았습니다.

 

 

 

 

 

 

 

 

 

 

URL 네임스페이스

 

그런데 한가지 더 생각해 볼 문제가 있습니다. 현재는 polls 앱 하나만 사용중이지만 polls 앱 이외의 다른 앱이 프로젝트에 추가 될 수도 있을 것이다.

 

이런 경우 서로 다른 앱에서 동일한 URL 별칭을 사용하면 중복이 발생할 것이다.

 

polls앱에서 상세페이지 path의 별칭도 name="detail"로 정의,

ABC앱에서 상세페이지 path의 별칭도 name="detail"로 정의,

yes앱에서 상세페이지 path의 별칭도 name="detail"로 정의하면

 

나중에 URL에서 별칭으로 매핑할 때 문제가 발생하고 그렇다고 중복을 피하기위해 모든 앱마다 사용할 상세페이지의 별칭을 detail1, detail2, ... 혹은 pollsdetail, ABCdetail, ... 등으로 사용하기에는 너무 귀찮고 불편합니다.

 

이 문제를 해결하기 위해서는 polls/urls.py 파일에 네임스페이스를 의미하는 app_name 변수를 지정해야 합니다.

 

다음처럼 polls/urls.py 파일에 app_name을 추가합시다.

 

위의 블록과 같이 app_name으로 네임스페이스를 지정합니다.

쉬운 이해를 위해 앱이름인 polls와 똑같이 'polls'를 네임스페이스로 사용했을 뿐 'polls'대신 다른 명칭을 사용하셔도 상관없습니다.

 

 

 

그런데 이 상태에서 새로고침을 하면

 

에러가 발생합니다. 그 이유는 네임스페이스를 지정해줬다면 이를 템플릿에서 사용해야하기 때문입니다.

 

템플릿에서는 네임스페이스를 어떻게 사용할까요?

 

 

index.html에서

 

위의 polls:detail과 같이 (네임스페이스)콜론:(URL별칭) 같이 적어줍니다.

 

 

 

다시 새로고침해도 문제 없군요.

 

 

 

 

 

 

 

오늘 배운 URL 별칭과 네임스페이스는 장고에서 매우 중요한 파트이니 꼭 꼼꼼히 이해하고 넘어가시기를 바랍니다.

 

 

https://wikidocs.net/70741

 

2-05 URL 별칭

* `[완성 소스]` : [github.com/pahkey/jump2django/tree/2-05](https://github.com/pahkey/jump2django/tree/…

wikidocs.net