[루비온레일즈] 유저-댓글 (댓글 edit 구현하기)

지금까지 유저와 댓글을 연결하고 댓글 작성, 삭제 기능까지 만들었습니다.

 

유저와 연결하게 되면서 로그인 여부에 따라, 작성자에 따라 댓글을 작성, 삭제까지 가능하게 만들었는데요, 이번에는 계속해서 작성자만 댓글을 수정할 수 있는 기능을 구현하겠습니다.

 

수정하기는 edit과 update 를 모두 만들어야 합니다. edit으로 이전 내용을 불러오고, update로 수정한 내용을 저장하기 때문입니다.

 

우선 이번 포스팅에서는 edit으로 이전 내용을 불러오는 기능을 만들고자 합니다.

---

1. 뷰 파일에 edit 버튼 만들기

새로운 댓글을 작성하는 기능을 만들 때, Partial 에 form 파일을 만들고, render를 통해서 해당 폼을 불러와서 댓글을 작성하고 또 볼 수 있도록 만들었습니다.

 

앞에서 이 폼에 destroy 버튼을 넣어준 것처럼, edit 버튼을 넣어주겠습니다.

 

_comment.html.erb 파일에 가서 아래 코드를 넣어줍니다. if...end 사이에 넣어야 destroy 버튼과 마찬가지로 유저가 로그인했을 때만 볼 수 있도록 합니다.

<%= link_to 'Edit', edit_board_comment_path(id: comment.id, board_id: comment.board.id) %>

 

<참고>

link_to를 사용할 때, 형식은 link_to '링크/버튼 이름', url, method 로 작성하면 되는데요.

 

여기서 링크나 버튼 이름은 사용자가 원하는대로 하면 되지만, url과 method는 정해진 방식대로 해야합니다. 위 경우에는 url 자리에 라우트를 활용해 board_comment_path 이런 식으로 라우트_path 를 붙여 사용할 수 있습니다.

 

만약 여기서 해당 라우트를 모르겠다면, 터미널 창에 rails routes | grep XXX 라고 입력하면 XXX와 관련된 라우트를 모두 ㅎ볼 수 있습니다.

예를 들어, rails routes | grep comment 라고 입력하면 comment 와 관련된 라우트를 확인할 수 있고, comment 대신 devise 를 넣어주면 유저 관련 라우트를 확인할 수 있습니다.

 

rails routes grep comment

뷰 파일에 버튼을 만들었으니, 서버를 열어 확인해보겠습니다!

Edit 버튼이 잘 생성되었습니다. 클릭해보면 아직 컨트롤러를 만들지 않았기 때문에 해당 액션이 없다는 에러가 발생합니다.

---

2. comment 컨트롤러 edit 액션, edit 뷰 파일 만들기

다음으로 comment_controller.rb에 edit 액션을 만들어줍니다.

 

그리고 12 라는 숫자 옆에 문서 아이콘을 클릭해 edit.html.erb라는 뷰 파일을 생성합니다.

 

여기서 edit 뷰 파일을 만들어줘야 하는데 일단 board의 edit.html.erb를 복붙하고 수정하겠습니다.

 

4번째 줄에 render를 보면 edit이라는 파셜의 파일을 불러와야 하므로, _edit.html.erb를 생성합니다.

폼 파일을 생성한 후에 _new.html.erb의 코드를 복붙해서 댓글 폼을 그대로 가져왔습니다. 그리고 form_for의 내용을 수정해줍니다. _new.html.erb의 form_for의 코드는 아래 이미지와 같습니다.

여기에서 새로운 comment를 작성하는 것이 아니라 기존의 내용을 불러와야 하기 때문에 @comment로 작성하고 2번째 줄에 Edit Comment로 텍스트를 변경합니다.

 

이렇게 폼까지 작성한 후 서버를 열어 동작하는 지 테스트하겠습니다.

 

edit 컨트롤러에서 뷰로 넘어갈 때, user_id 가 nil 일때 메소드가 지정되어 있지 않다는 에러가 발생했습니다. 그래서 edit 액션에 @comment = Comment.find(params[:id])로 @comment 를 찾게해서 해당 comment가 갖고 있는 user_id를 불러오도록 합니다.

 

 

update 액션을 만들지 않아서 아직 수정하기가 완벽히 구현되지 않았지만, 일단 이전 내용을 불러오는 것은 성공했습니다!

---

그런데, 조금 이상해 보이는 게 보통 웹사이트에서 댓글을 수정하고자 하면 수정하는 페이지가 새로 열리는 게 아니라 댓글이 달려있는 게시물의 show 페이지에서 바로 폼을 불러와 수정합니다.

 

그래서 다음 포스팅에서는 지금처럼 새 페이지를 열어서 폼을 불러오는 것이 아니라 show 페이지에서 바로 폼을 불러오도록 바꿔보겠습니다.