이번에는 디테일 페이지를 만들어 보도록 하겠습니다. 디테일 페이지는 목록이 나와있는 페이지에서 버블 버튼을 누르게 되면 디테일 페이지에 들어가서 해당 게시글만 자세하게 볼 수 있습니다.

글이 많으면 디테일 페이지가 많아집니다. 하나하나 만드는 것이 아니라 하나의 html 파일을 만들어서 재사용할 것입니다.

detail 페이지는 post_list.html의 축소판입니다. 필요한 기능 배치만 따로 한다고 보시면 됩니다. Ajax 통신을 하는 JavaScript파일도 새로운 파일로 만들도록 하겠습니다.

이제 버블 버튼을 누르면 디테일 페이지로 이동하는 기능을 작성하도록 하겠습니다. 개발자 도구를 이용해 버블 버튼이 어떤 클래스를 가지고 있는지 확인합니다.

해당 클래스를 post_list.html 파일에서 검색합니다. div.sprite_bubble_icon 태그를 a태그로 감싸도록 하겠습니다. 해당 포스트의 detail 페이지로 이동하는 링크로 만드는 것입니다.

파일명 : post/templates/post/post_list.html

**<a href="{% url 'post:post_detail' post.pk %}">**
    <div class="sprite_bubble_icon"></div>
**</a>**
<!-- <div class="sprite_share_icon" data-name="share"></div> -->

공유 아이콘인 div.sprite_share_icon 태그는 사용하지 않을 것이므로 주석처리 해줍니다.

post/urls.py에 detail 페이지로 가는 URL을 추가하겠습니다.

파일명 : post/urls.py