본문 바로가기

전체 글

(114)
상세페이지 - 각 댓글별 수정 모드 🚨 문제현재 진행중인 최종프로젝트의 댓글 기능 구현 중 입력된 댓글의 수정 버튼을 눌렀을때, 개별 댓글이 아니라 댓글 전체가 수정모드가 된다. 기존코드const [commentItem, setCommentItem] = useState("");const [edited, setEdited] = useState(false);// 편집모드 const handleNicknameEdit = () => { setEdited(!edited); }; {commentList?.map((comment) => ( {edited ? ( ( { e.prev..
Tanstack Query - useMutation 오류 🚨 발생한 문제댓글 CRUD 중 useMutation으로 수정하는 로직 작성 중 useMutation은 기본적으로 하나의 인자만 받도록 되어있어서 두개의 인자를 넣어주게 될 때, 오류가 발생한다고 한다. 그래서 객체로 인자를 넣어줬으나 mutationFn 에서 형식에 할당할 수 없다는 에러 문구가 조회되었다. ✅  해결방법useMutation의 제네릭 타입을 명시적으로 지정해주어야 했다. const { mutate: updateComment } = useMutation({ mutationFn: ({ commentId, content }) => updatePostComment(commentId, content), onSuccess: () => { queryClient.in..
[TIL] 모의면접 ① 질문들간단하게 자기소개 해주세요.저희 회사는 vue.js도 사용을 하는데, 만약 vue.js를 배워야한다면 뭐부터 시작을 하실 건가요?프로젝트에 참여한 누군가가 내 코드를 변경시킨다면 기분이 어떨 것 같으신가요?반대로 누군가의 코드를 변경시켜야 한다면 어떤 경우일까요?커리어 관점에서 10년 후 지향하는 목표와 이루고 싶은 성과에 대해 이야기해주세요.프론트엔드 개발자로서 중요한 부분이 무엇이라고 생각하시나요?그렇다면, 기술적인 부분은 별로 중요하지 않다고 생각하시는 걸까요?개발자로서의 성장이 무엇이라고 생각하시나요?프로젝트를 하다가 의사소통에 실패한 경험이 있다면 말씀해주세요. 추가질문들- 부트캠프에서 뭐 배웠어요?  ✅ 피드백- 자기소개  외워서 온 느낌이 조금 강했다. 조금 딱딱한 느낌이 있어서, 대화..
[TIL] 미들웨어(Middleware) 미들웨어(Middleware)- 요청이 처리되기 전에 실행되는 서버 측 함수- 요청을 가로채어 인증, 리다이렉션, 또는 사용자에 맞는 페이지를 제공하는 등의 작업을 수행할 수 있음 미들웨어의 역할- 사용자 인증 및 권한 검증 : 특정 페이지에 접근하기 전에 사용자가 인증되었는지 확인- 페이지 리다이렉션 : 권한이 없는 사용자를 로그인 페이지로 리다이렉션하거나, 다른 적절한 페이지로 안내할 수 있음- 요청 정보 변경 : 요청 객체의 내용을 변경하거나 추가 작업을 수행할 수 있음
최종 프로젝트 시작 어제 최종 전의 마지막 프로젝트 발표를 끝내고 이제 찐막 프로젝트 팀 편성이 되었다.한번도 같이 해본적 없는 팀원분들이지만 다들 활달하시고 느낌이 좋았다.앞으로 한달동안 진행할 프로젝트이기 때문에 주제 선정과 기획에 있어 이전에 하던 프로젝트 보다 훨씬 열띠게 의견을 공유하고 투표하고,, 반복하다가 스터디 그룹에 특화된 툴을 제공하는 서비스 앱으로 주제가 정해졌다. 주제에 맞춰 어떤 기능들이 들어가야할 지와 기한에 맞춰 구현을 끝낼 수 있는 필수기능, 시간이 된다면 추가적으로 도전해볼만한 기능들을 나누었다. 그리고 각자 맡아서 구현할 기능들을 큼직하게 분배하였는데 이 부분은 좀 더 상세하게 논의해봐야한다.이전에는 디자인 구상까지 직접 진행하였는데 이번 최종에서는 디자이너 두분이 같이 진행하게되었다.확실히..
git stash git stashModified이면서 Tracked 상태인 파일과 Staging Area에 있는 파일들을 보관해두는 장소아직 끝내지 않은 수정사항을 스택에 잠시 저장했다가 나중에 다시 적용할 수 있음(브랜치가 달라져도 가능)  ❓ 사용하는 이유- 작업중 갑작스럽게 다른 작업을 진행해야 할 때- 아직 커밋하기엔 이른 경우- 다른 브랜치로 체크아웃할 때 변경사항을 유지하고 싶은 경우(나는 체크아웃 할 때 이 메세지를 가장 많이 보는 듯하다.)  💻 명령어 사용해보기파일을 하나 추가하고, 수정한 파일들을 git add 로 Staging Area 에 추가하였다.  git stashgit stash 명령어를 입력하니 워킹디렉토리가 깨끗해졌다.이제 원하는 브랜치로 문제없이 이동할 수 있다. git stash li..
Vercel 배포 오류 Error: Command "yarn run build" exited with 1 🚨 프로젝트를 Vercel에 배포하는 과정에서 에러가 발생했다.에러 로그들을 읽어보며 보이는 자잘한 문제들을 하나씩 해결했는데 마지막 로그인 "Error: Command "yarn run build" exited with 1" 는 무슨 오류인지 이해하기 어려웠고,구글링을 해본 결과 종속성, 빌드 스크립트 오류 등 여러가지 이유가 있는 것 같았다.  ✅ 해결방법tsc --noEmit 명령어를 입력하여 타입스크립트 타입을 체크해보았고, 매개변수가 사용되지 않는 빈 함수가 props로 내려지는 것을 발견할 수 있었다.해당 부분을 해결하고 나니 더이상 추가적인 빌드에러는 발생하지 않았고 정상적으로 배포가 완료되는 것을 확인할 수 있었다. npx tsc --noEmit 명령어 실행 테스트handleDelete ..
github 잘못올라간 파일 커밋 히스토리 삭제하기 발생 배경팀 프로젝트에서 사용 중인 supabase key 값이 포함된 파일이 커밋, 푸시가 된 상태에서 pr, merge가 완료 된 불상사가 발생했다.merge가 된 파일을 각자 local 기능브랜치에 pull을 받으면서 각 브랜치에도 merge된 commit 기록이 생겼고,, 뒤늦게 발견했다.  🚨문제PR은 Revert되어 해결했으나 각자 개인브랜치에 로컬에서 머지한 커밋 기록이 생겼고 해당 커밋에서 문제의 파일을 확인할 수 있었다.  ❓원인이번 프로젝트에서는 pr 규칙을 크게 설정하진 않고 화면공유를 해서 개인이 pr을 올리면 직접 merge 승인까지 했었다보니, 서로의 코드를 꼼꼼하게 살펴보지 않았던 것이 원인이었던 것 같다.  ✅ 해결방법모든 커밋에서 특정 파일을 제거하고 커밋을 재작성하는 명..