Today I Learned 사이드바 프로필 정보 상태관리 원래 사이드바에서 보이는 프로필 이미지와 닉네임 정보는 마이페이지 api가 아닌 딱 프로필 정보만 리스폰스로 받아오는 또다른 api를 사용하고 있었다. 마이페이지 api로 받아오는 데이터는 프로필 정보 외에도 유저가 작성한 글 등 양이 꽤 많았기 때문이다. 마이페이지에는 프로필 이미지와 닉네임 변경 기능이 포함되어 있는데, 프로필 정보 변경 기능도 마이페이지 모듈 안의 리덕스와 연동하여 관리하고 있어 프로필 이미지와 닉네임을 변경하면 마이페이지에서 보여지는 프로필 이미지와 닉네임은 바로 변경사항이 적용되었지만, 사이드바에서의 프로필 정보는 의도적으로 리로드를 해줘야 변경되는 문제가 있었다. 1) 사이드바는 그대로 프로필 정보만 받는 별도의 api..
Today I Learned 실전 프로젝트를 하는 시간이 지날수록 하루하루 내가 하는 일들이 줄어드는 느낌이다. 분명 새롭게 배우는 건 있는데 보여지는 건 지금까지 해왔던 것과 그렇게 큰 차이가 없어서 그런 건지.. 오늘은 주로 서버와 연결하는 일들을 했다. 마이페이지 DB 연결 마이페이지에서 유저와 관련된 어떤 데이터를 화면에 뿌려줄지 논의가 제대로 되지 않아서 백과 프론트 모두 작업 후순위로 두고 있다가 수요일 정기회의에서 픽스가 돼서 작업을 하기 시작했다. 화면에 출력할 데이터는 크게 세 가지 섹션으로 나눠져 있다. 1. 유저 프로필 영역 : 프로필 이미지, 닉네임 2. 유저가 등록한 단어 수, 게시글 수 (커뮤니티 + 짤방 게시글 합) 3. 유저가 등록한 단어, 게시글, 짤방 (커뮤니티, 짤방 따..
Today I Learned comment API 모듈 작성 오늘은 커뮤니티 페이지의 게시글에 들어갈 댓글 목록 조회, 추가, 수정, 삭제 모듈을 작성하였고, 이전 미니 프로젝트에서 댓글 모듈을 연결해 본 경험이 있어 어렵지 않게 써내려갈 수 있었다. 모듈을 작성하는 과정에서 전날 백엔드 분들과 정했던 댓글 API 명세서에서 response로 받을 데이터 형태에 수정이 필요할 것 같아 스프링 짱짱 팀장님께 말씀 드렸고, 빠르게 수정해주셨다! CRUD를 할 때마다 느끼는 점은 비슷한데, 어떤 데이터를 보내서, 어떤 데이터를 받아올 지는 물론이거니와, 리스트나 딕셔너리 등 보내거나 받을 데이터의 형태에 대해서도 신경써야 한다는 것이다. 데이터의 형태에 따라 활용할 때 코드가 더 복잡해지거나 간결해지기도 하고..
Today I Learned quiz 로직 작성 원래 스와이퍼 라이브러리를 사용해서 각 문제가 슬라이드로 넘어가도록 구현하려고 했다. 1) 기본으로 있는 화살표 아이콘의 prev 버튼과 next 버튼을 없애고 별도의 버튼을 만들어 동작하게 하고, 2) quizIndex라는 state를 만들어서 퀴즈 문제가 마지막일 때는 삼항연산자로 조건부 렌더링을 걸어 next 버튼의 텍스트가 다음 문제가 아닌 결과 보기로 렌더링 되도록 하려고 했으나, onClick의 문제인지 코드를 모두 작성하고 나니 nextEl 버튼이 제대로 동작하지 않았다. 두 가지 문제가 있었는데, 첫 번째는, nextEl 버튼을 클릭하면 다음 문제로 넘어가는 게 아니라 prevEl 버튼을 클릭한 것처럼 이전 문제로 돌아갈 때가 있었고, 두 번..