25. 폼으로 댓글 기능 구현(Comment 모델, 상세 페이지에 댓글 기능 반영)

● Comment 모델 만들기

 

models.py에 Comment 모델 추가 후 migration

  post는 어느 포스트에 작성한 댓글인지를 저장하는 변수다. author은 누가, content는 댓글 내용을 저장하고, created_at은 댓글 작성일시, modified_at은 수정일시를 저장한다. 

 

  여러 댓글들이 작성될 수 있도록 post 필드는 ForeignKey로 설정한다. 그리고 아래쪽에는 author와 content를 출력하게 해주는 __str__() 함수를 만든다.

DB에 반영하기 위해 migration 한다.

 

댓글 작성 페이지 확인

  blog/admin.py를 수정하여 관리자 페이지에서 댓글을 관리 할 수 있도록 한다.

 

● 포스트 상세 페이지에 댓글 기능 반영

  댓글 기능을 구현했으니 실제로 페이지에 반영해야 할 차례다. 지금은 댓글창을 보여주기 위해 미리 써진 댓글들 뿐이지만 이제는 댓글을 사용자들이 직접 입력하고 반영할 수 있다.

 

 post.detail.html의 <div class="comment-area">에 부분이 댓글을 보여주는 기능을한다.  post.detail.html파일의 comment 부분에 id를 부여한 후의 comment-area의 구조는 다음과 같다.

(테스트 코드를 통과하지 못했기 때문에 아래 구조는 참고만 한다. 대댓글 기능은 따로 구현하지 않는다. )

댓글칸은 id="comment-1",&nbsp; id="comment-2" 로 수정해야 한다. 위의 스샷대로 하면 테스트 코드를 통과하지 못했다.

  댓글 id를 parent-comment로 하려 했으나 comment-1 같이 뒤에 숫자형이 오게 해서 각 comment에 부여된 pk 값에 따라 id를 부여하는 방식으로 해야 몇 번째 댓글인지 확연히 구분된다. 

 

테스트 코드 작성

  TestView class의 setUp() 함수 아래 부분에 이전에 작성한 post_001 포스트를 대상으로 작성자jus 와 content 첫 번째 댓글 Test를 입력한다. 

test_post_detail(self): 맨 아래에 id=comment-area가 부분에서  id가 parent-comment인 것이 있는지 찾고 그 <div>태그안에 작성자명 jus와 content가 있는지 확인하는 코드를 작성한다.

 

포스트 상세 페이지에 작성한 댓글 나타내기

 

post_detail.html 수정

   {% if post.comment_set.exists %}에서 if 조건문을 쓰는 이유는 포스트에 댓글이 달려있지 않은 경우가 있다. 그럴 경우 굳이 댓글을 불러올 필요가 없기 때문이다. 

 

  댓글이 있다면 for문으로 반복하여 HTML코드를 만들고 <div>태그의 id는 comment 뒤에 pk 값이 붙게 하여 댓글들을 구분한다. &nbsp; 는 공백을 의미한다. comment의 내용은 <p> 태그 안에서 뜨고 django에서 제공하는 템플릿 필터 기능인  linebreaks로 줄 바꾸는 기능을 부여해 준다.

 

VIEW ON SITE 버튼 만들기

  관리자 페이지에서 comment가 작성된 포스트를 보기 쉽게 하도록 버튼을 추가한다.

 

  Comment 모델에 get_absolute_url() 함수를 정의하고 return f'{self.post.get_absolute_url()}#comment-{self.pk}' 입력한다. 여기서 #comment에서 # 이 뜻하는 것은 HTML 요소의 id를 의미하고, comment-{self.pk}는 댓글이 작성된 순서대로 부여된다. 예를들면 comment-1, comment-2 이런 식이다.  따라서 VIEW ON SITE 버튼을 누르면 해당 댓글로 이동하게 된다.