view/edit 모드 둘 중에 하나라도 true라면 document.body.style.overflow = 'hidden' 옵션을 주려고 했다. useEffect에서 [viewTask, editTask]를 dependency로 두고 view, edit 모드 둘 중에 하나만 true면 백 고정, 그 이외의 상황에서는 모두 auto로 돌려줬다. useEffect(() => { if (viewTask || editTask) { document.body.style.overflow = 'hidden' } else { document.body.style.overflow = 'auto' } return () => { document.body.style.overflo..

!! 투두리스트에서 모달로 CRUD하고 싶은 상황 !!전에 만들었던 모달은 차력쇼로 하나 하나 만들었어서, 이번에는 상태관리도 붙이면서 좀 생각해보면서 만들고 싶어서 방법을 고민해봤다.그리고 간단한 프로젝트이기도 하고, 주스탠드 좋다고 많이들 하셔서 어떤 점이 좋은지 경험해보고자 도입했다. 리덕스를 쓰기엔 이 프로젝트가 너무 조그맣고,, 쬐끄만,,, 이런 느낌이었다. 일단 task를 작성하는 액션에 타입으로 boolean값을 부여하고 액션의 boolean 값에 따라 모달을 보여주기로 정했다.흐름은 대충 이런 느낌.Create작성하기 클릭 -> 모달 open ->모달 내에서 task(title, detail) 작성 후 제출하기 버튼 클릭 ->모달 close, 작성된 task가 /today 페이지의 컴포넌트..

AWS Amplify 빌드 중에 다른 것도 아니고 뜬금없이 Module not found: Can't resolve '/...'2024-06-12T05:08:07.742Z [WARNING]: ./app/_components/layout/Sidebar.tsxModule not found: Can't resolve '@/_components/auth/signout/actions'https://nextjs.org/docs/messages/module-not-found./app/_components/layout/Sidebar.tsxModule not found: Can't resolve '@/public/icons/signouticon.png'https://nextjs.org/docs/messages/modul..

배포 후 랜덤 QA를 진행하던 중, 다음과 같은 피드백을 받았다.소셜 로그인을 진행하지 않고, 이전 페이지로 돌아갔을 때 어떠한 에러가 발생하는 것 같습니다. (아래 일부 사진) 정확한 상황은, OAuth 로그인 버튼을 눌러서 구글의 동의 화면으로 이동했을 때 뒤로가기를 누르면 다음과 같은 화면이 나왔다.찾아보니 이 에러를 OAuth flow error라고 하던데, OAuth 액션 함수에서 에러 처리를 안해서 뜬 거였다.  방어코드로 error를 확인하고 에러가 발생하면 /signin 페이지로 돌아가도록 수정했다.