라우터 썸네일형 리스트형 [React][Next.js] <Link></Link>를 통한 라우터 기능 - <Link> 내부에 <a> 태그를 넣는 이유 사용 방법 import Link from 'next/link' function Home() { return ( About ) } export default Home Next.js에서 라우터 기능은 다음과 같이 사용합니다. ... 형식을 사용하지 않는 이유 React는 SPA(Single Page Application)구조를 가지고 있어 하나의 페이지에서 모든 행위들이 일어나야하는데 About us 형식을 사용하게 되면 새로고침(페이지 이동)을 하기 때문입니다. 내부에 태그를 넣는 이유 About 위와 같이 태그를 넣지 않아도 넣은 것과 외관상 차이가 없으며 기능도 정상적으로 동작하는 것을 확인할 수 있습니다. About 그러나 위와 같이 태그 내부에 class 요소를 추가하여 HTML를 랜더링하면 cla.. 더보기 [react-router-dom][v6] URL 파라미터를 통해 하위 경로로 이동하기 영화 리스트를 보여주는 페이지와 특정 영화의 상세 정보를 보여주는 페이지를 react-router-dom 패키지를 통해 구현하고자 했다. 다음과 같이 구현해도 정상적으로 동작하였지만 'movies'가 공통적으로 들어가기 때문에 하나의 그룹으로 경로를 묶고자 하였다. // 영화 리스트를 보여주는 페이지 // 영화 상세정보를 보여주는 페이지 따라서 다음과 같이 'movies'를 그룹화하여 구현하였다. // 영화 리스트를 보여주는 페이지 // 영화 상세정보를 보여주는 페이지 처음에는 다음과 같이 구현하였지만 정상 작동하지 않았다. // 영화 리스트를 보여주는 페이지 // 영화 상세정보를 보여주는 페이지 공식 문서에서 어떤 차이가 있어 정상 동작하지 않는지 확인하고자 하였으나 해당 페이지에는 별도의 내용이 기술.. 더보기 이전 1 다음