Trouble Shooting

개요 > 카테고리(탭) 클릭 시 해당 섹션으로 부드럽게 스크롤 이동 구현 과정 대략적인 레이아웃 구조는 다음과 같다 카테고리 탭-섹션이 한 쌍을 이루어 4번 반복 해당 카테고리 탭 ul 태그에 click 이벤트 핸들러 등록 문제 > - window.scrollTo

마이페이지에서 내 정보 수정 버튼을 누르면 내 정보 수정 페이지가 모달 창으로 뜨게 하는 작업 진행 중\+intercepting routes (가로채기) 구현구글링해보니 동일한 폴더명 때문에 종종 생기는 오류인 것 같아 member/id를 통으로 삭제 후 interce

로그인 완료 시 redirect 되지 않고 오류 발생하는 현상app/login 페이지 내에 LoginModal.tsx import (클라이언트 컴포넌트)Next.js(14버전) , next-auth@beta(5버전)클라이언트 컴포넌트라 redirect:false 후 r

개요 .env, .env.local 파일이 gitignore되지 않아 (분명 .gitignore파일에 포함되어 있는데도😒) 소셜 로그인 구현을 위해 발급 받은 카카오 및 네이버 API KEY가 그대로 깃헙에 올라갔다 이런 경고 메일이 와서 사태 인지 참고velo

로그인 시 json 형태 응답값으로 전달되는 accessToken 값을 저장해 앞으로 모든 API 요청 헤더에 해당 토큰 값을 포함시켜야 함 (axiosInterceptor)next-auth에서는 session에 유저 정보를 저장하여 전역에서 쓸 수 있었는데, 다만 사

기존 유저 인증 관련하여 auth.js 를 쓰다가 로그인 성공 시 redirect가 정상적으로 이루어지지 않는 버그 ( 버전 자체 버그같다 \[이슈 참고] ) 및 서버&클라이언트 관련한 여러 이슈로 (auth.ts로직은 서버에서 이루어지기 때문에 브라우저를 이용한 상태

Vercel 배포 과정 중 middleware.ts 에서 파생된 오류 관련배포 과정 중 middleware.ts에서 local 서버 주소를 떼니 상대 경로x 절대 경로만 써야 한다는 오류 메세지" Error : URL is malformed "/login". Pleas

배포 초반에 수많은 eslint 관련 오류들과 함께 location is not defined 이라는 오류가 떴다실제로 프로젝트 코드 중에 location 이라는 변수 선언도 있었고,DELETE 요청 성공 시 화면 새로고침을 위한 location.reload() 코드도

Vercel 배포 중 CORS 에러와 Next.js Proxy 우회배포에 성공은 했으나 주소 접속 시 해당 에러 창 발생next.js 에서는 next.config.ts에서 rewrite으로 cors 우회가 가능하다공식문서proxy 설정 확인브라우저 Network 의 r

프로젝트 하면서 며칠 내내 가장 골머리를 앓고 있었던 문제가 바로로그인 시 axiosInstance에 header 토큰 설정이 곧바로 이루어지지 않는 것이었다로그인 완료 -> 로컬스토리지 및 쿠키에 토큰 저장 ->전역 상태 store에도 저장 -> axiosInstan

개요 > - 회원가입 시 유효성 검사 중 입력한 닉네임이 중복이라면 서버에서 400 에러와 함께 이미 존재하는 닉네임이라는 에러 메세지를 응답값으로 준다 회원가입 요청은 async/await + try catch 문 axios로 로직 처리 문제 및 해결

여태껏 intersection observer 을 이용한 스크롤 애니메이션 기능을 처리할 때는 useInView 를 이용하여 작업하지만 하나의 컴포넌트가 아니고 예를 들어 여러 컴포넌트에 지정해야한다면?비효율적+코드가 길어질 뿐더러 컴포넌트 개수마다 각각 지정할 수도

Github 파일 크기 제한인 100MB 용량을 초과하는 영상이어서 원격 저장소에 push가 되지 않는 상황

회사 프로젝트 중 테스트 서버와 실제 라이브 서버가 사용하는 api 서버가 각각 달랐다 테스트 서버에 반영되는 test 브랜치와 라이브 서버에 반영되는 main 브랜치에 build 시 .env 파일의 api 서버를 매번 수동으로 변경했었음..ㅎ