router.push와 router.replace의 차이

useRouter로 생성한 객체인 router를 사용할때
browser history와 관련된 메서드인 push와 replace가 있다

일단 라우터 히스토리는 스택 구조로 되어있는데, push를 사용하면 새로운 route가 스택의 top으로 올라가고 replace를 사용하면 스택의 top을 완전히 그 route만으로 덮어씌운다(overwritting)

예를 들어 'page/product'에서 'page/product/detail'로 push를 사용해서 이동한 후에 뒤로가기를 누르면 'page/product'로 이동함
하지만 replace로 이동한 후 뒤로가기를 누르면 'page'로 이동함

그러니까 page를 기준으로 page/product 페이지에서 (replace 메서드를 사용한) 버튼을 눌러 page/product/detail로 이동한 상태에서 뒤로가기를 누르면 라우터 히스토리에는 page -> page/product/detail로 덮어씌워졌기 때문에 이전 페이지는 page가 된다

따라서 유효하지 않은 접근을 한 유저가 뒤로가기 버튼을 눌러서 다시 유효하지 않은 페이지로 이동하려고 한다면 replace를 사용해서 그것을 차단하면 유용함