댓글 삭제 기능 구현 중 대댓글과 관련된 이슈가 발생했다. 대댓글이 있는 댓글을 삭제하면 밑에 달려있던 대댓글까지 1+1 마냥 같이 삭제가 돼버리는 문제 발생한 것이다. 근데 데이터베이스를 확인해보니 댓글은 지워졌지만 대댓글은 지워지지 않았었다. 사실은 대댓글은 삭제가 된 것이 아니라 화면에 보이지 않는 것이었다. 왜냐하면 댓글이 있어야만 해당 댓글 밑에 대댓글이 보이게 해 놨기 때문이다. 댓글이 없어져 버리면 대댓글도 같이 없어져 버리는 기이한 현상이... 그래서 댓글을 삭제할 때 대댓글을 어떻게 처리해줄까 방법을 고민해봤다. 처음으로 생각해낸 방법은 댓글 삭제 시 대댓글이 있으면 대댓글이 존재하기 때문에 댓글을 삭제할 수 없다는 문구가 나오게 하는 것이었다. 두 번째 방법은 대댓글이 있는 경우에도 댓..

오늘은 리팩터링은 필요하다고 느꼈을때 바로 해주는게 좋다는것을 깨달은 날이다. Post라는 게시글 세부 정보 컴포넌트를 만들면서 게시글에 필요한 정보들을 PostPage에서 Post 컴포넌트로 props를 전달해주는 구조였는데 props가 점점 쌓여 20개가 넘어가니까 리팩터링할때 엄청난 괴로움을 느꼈다. 현재 구조가 게시글 세부 페이지에 필요한 정보들을 post의 상위 컴포넌트인 PostPage에서 post의 상태를 관리하는 store를 이용해 상태들을 props로 내려주는 형태(PostPage -> Post)로 만들어져 있다. 그리고 게시글안에 댓글도 들어가는데 댓글은 별도의 컴포넌트로 만들어서 post안에 댓글 컴포넌트도 있기 때문에 최상위 컴포넌트인 PostPage에서 Post컴포넌트에 내려줘야하..

오늘은 게시글 수정 기능 구현하다 만난 문제와 해결방법을 적어보려고 한다. 우선 게시글을 수정할때 react-hook-form의 useForm을 이용해서 form을 생성해 수정된 게시글을 제출할 생각이였다. 수정할때 요구사항으로는 수정하려는 게시글의 제목과 내용을 수정할때 수정 폼에서 내용이 이미 입력된 상태여야 했다. 그래서 input태그 안에 value를 설정하고 value안에 기존에 갖고 있던 제목과 내용을 넣어줬다. 그리고 value값을 설정해주었기 때문에 입력할때 변화가 일어나게 하려면 input태그 안에 onChange를 넣어서 글자가 바뀌면 useState를 이용해 value값을 바꾸려고 했다. 그런데 아무리 입력해도 value값이 바뀌지 않고 변화하지 않는 문제가 발생했다. 처음에는 use..

오늘은 게시판에서 게시글이 많을 때 게시판의 가독성적인 부분이나 정리된 화면을 위한 페이지네이션 기능을 구현했다. 페이지네이션(Pagination)이란? 게시판에서 모든 게시글을 한 화면에 모두 보여준 게 아니라 페이지를 나눠서 제공하는 것을 의미한다. 정렬 방식과 페이지의 크기, 그리고 몇 번째 페이지인지의 요청에 따라 정보를 전달해주는 것이 Pagination이다. 구현 목표 화면 한 화면에 게시글은 총 10개만 출력이 되고 넘어갈 시 다음 페이지 버튼이 생성된다. 한 화면에 보여주는 페이지 버튼은 총 10개(게시글 100개) 게시글이 100개가 넘어갈 시 다음 페이지(11페이지)로 이동할 수 있는 "다음"버튼이 생성된다. 만약 게시글이 100개가 존재하지 않는다면 다음 버튼은 생성되지 않는다. 11..

오늘은 카테고리별 게시판을 만들어 봤다. 일단 카테고리별로 출력되는 게시글이 달라져야 했기 때문에 쿼리 스트링을 사용해서 카테고리의 아이디 값을 얻어와 카테고리에 포함된 모든 게시글들을 출력하도록 했다. localhost:8080/posts?category=1 여기서 (?category=1) 이 부분을 쿼리 스트링이라고 불린다. 그러면 위와 같은 path에서 쿼리만 가져오는건 어떻게 할 수 있을까?? useLocation 우선 useLocation을 사용해서 쿼리를 받아오는 방법을 알아보자. const location = useLocation(); useLocation을 이용해 location을 콘솔 창에 찍어보면 아래와 같은 결과가 나온다. 그중 search를 보면 우리가 원하는 정보인 쿼리("? ca..

오늘도 아샬 님이 오셔서 라이브 코딩을 하며 여러 가지 꿀팁을 전달해주시고 가는데 그중에서 오늘 내 코드에 적용한 것들만 정리해 봤다. Controller는 간단하게 Controller는 최대한 간단하게 만드는 게 좋다고 해주셨다. 그에 반해 나의 Controller는 상당히 복잡했다. 그 이유가 post라는 게시글에 전달해줘야 할 정보가 post객체뿐만 아니라 comment 같은 부가적인 객체들도 같이 전달해줘야 했기 때문에 여러 서비스를 호출해서 전달해줬는데 이것 때문에 복잡한 Controller가 만들어진 것이었다. controller를 최대한 간단하게 만들기 위해서 하나의 Action에서는 하나의 Application Service가 호출되어야 한다. 그래서 여러 개의 서비스를 불러서 전달해주던 ..