react

Next.js의 useEffect hook에서 router.query 값을 받는 방법

Next.js의 useEffect hook에서 router.query 값을 받는 방법 안녕하세요, 개발하며 달리는 쿼카입니다. 이번 글에서는 Next.js의 useEffect hook에서 router.query 값을 받는 방법에 대해 알아보려하는데요, 저도 router.query에 따라 필요한 데이터를 가져오는 코드를 짜다가 해당 문제를 겪어서 해결책을 적어보고자합니다. 일반적으로 생각하는 router.query의 값이 useEffect에서 바로 보장될 거라 생각하지만, 보장이 되지 않습니다. 그럼 어떻게 해결할까요? 바로 router 객체의 isReady 값을 이용합니다. 해결책 const router = useRouter(); useEffect(()=>{ if(!router.isReady) retur..

Next.js의 redirect 설정을 없애도 계속 적용될때 해결법

Next.js의 redirect 설정을 없애도 계속 적용될때 해결법 안녕하세요, 개발하며 달리는 쿼카입니다. 이번 글에서는 Next.js의 redirect 설정을 없애도 계속 적용될때 해결법에 대해 알아보려합니다. module.exports = { async redirects() { return [ { source: '/foo', destination: '/bar', permanent: true, }, ] }, } Next.js에서 위와 같이 next.config.js에 rediect 설정을 해놓고 제거하는 경우에 혹은 다른 프로젝트를 사용하는데 localhost:3000을 똑같이 이용하는 경우에 redirect가 되어서 막막했던 적이 있었는데요 그 해결방법에 대해서 알아보려합니다. 방법 방법은 간단합니..