Routing2 Shallow Routing 리액트와 같은 싱글 페이지 어플리케이션은 전체 페이지를 업로드 후 특정 부분을 돌아다니며 보여주는 개념이다. 이때 새로고침 화면도 바뀌지만, 주소도 바뀌어야 사용자가 덜 헷갈릴 수 있다. 이를 돕는 게 shallow routing이다. 리액트의 프레임워크격인 Next.js에서 useRouter로 해당 기능을 지원한다. import { useRouter } from "next/router"; export default function RouterPage(){ const onClickToPage = () => { router.push(url, as, option) } return( 안녕하세요 )} 안녕하세요 버튼을 누르면 특정 페이지로 이동하게 한 코드다. 여기서 onClickToPage를 router.pu.. 2022. 10. 25. static routing & dynamic routing routing 명사로 여정, 전달, 발송절차를 뜻한다. static routing과 dynaminc routing을 직역하면 정적 전달, 동적 전달이다. static routing은 전달 방법와 주소가 정확히 정해져 있고, dynaminc routing은 전달 방법와 주소가 때마다 달라질 수 있는 방식이다. 여기서는 네트워크보다는 프론트엔드, 그리고 리액트를 확장팩격인 nextjs를 사용할 때 사용 방식을 위주로 정리한다. static routing static routing은 매우 간단하다. 우리가 만든 폴더가 주소다. http://도메인.닷컴/0boards/new와 같이 되어 있다면 실제 리액트에서는 아래 사진과 같은 폴더 구조를 가진다. 따라서 개발자가 폴더 이름이나 폴더 구조를 바꾸지 않는 이상 .. 2022. 9. 19. 이전 1 다음
