오늘은 리팩터링은 필요하다고 느꼈을때 바로 해주는게 좋다는것을 깨달은 날이다. 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가 호출되어야 한다. 그래서 여러 개의 서비스를 불러서 전달해주던 ..

월요일은 한주의 스프린트가 끝나는 날로 트레이너님과 스프린트 점검과 이번 주의 작업 계획을 다시 세우는 날이다. 저번 주와 다르게 이번 주는 채팅 기능 구현하는데 시간을 많이 소비해 구현해야 할 태스크들을 전부 끝내지 못한 상태라 찝찝함이 남아있는 상태로 스프린트 점검 시간을 기다리고 있었는데 아샬 님이 직접 내려오셔서 동료 한분이 쓰신 기획서를 모두 같이 보면서 피드백을 들었다. 그중에는 동료 한분에게만 국한되는 이야기가 아니라 프로젝트를 진행하고 있는 모두가 공감할만한 이야기와 알아두면 좋을 내용들도 너무 많이 이야기해주셨다. 기획서 작성할 때 가장 힘들었던 사용자 스토리 부분에 대해서 우선 말을 해주셨는데 가치 중심으로 썼다고 생각했던 나의 사용자 스토리가 정말로 가치 중심인지 다시 한번 생각하게 ..