useLocation [React] GNB 현재 위치 표시 현재 사용자가 어느 페이지에 있는지 표시하기 위해 페이지 이동 할 때마다 GNB color 변경 페이지 이동은 Link로, color 변경은 onClick 으로 단순하게 생각했었다. 페이지에 머무르는 동안에는 GNB color를 유지해야 하고, 페이지 이동 할 때마다 color가 변경되어야 하니 useState로 color 값을 관리하려고 생각했다. 페이지 이동하면서 컬러도 바뀌지만 onCl... 페이지 이동pathnameGNB coloruseLocationlinkGNB color [React #13] 동적 라우팅과 Path Parameter, 그리고 관련 Hooks 도메인 주소 끝에 해당 아이템의 id값이 추가되어 페이지를 이동하고, 이동한 페이지에서는 id값에 해당하는 데이터가 보여지는 것을 볼 수 있다. -> url 을 살펴보면 url 마지막에 특정 id 값이 들어가고(/32692, /53424), 해당 id 값에 따라 서로 다른 상세 페이지 정보가 화면에 그려지는 것을 볼 수 있다. id 값에 따라 무수히 많은 url 이 나타날 것이고, 각각의 모... 동적 라우팅path parameteruseNavigateTILReactdynamic routinguseParamuseLocationReact 로그인 성공 후 Nav 상태 변경 로그인을 성공하면 '로그인, 회원가입' 버튼이 유저의 닉네임과 로그아웃 버튼으로 변경이 되어야한다. Nav 로그인 전 이미지 Login.js 일단 로그인이 성공하면 백엔드에서 토큰을 전달받게 되고 전달받은 토큰을 세션스토리지에 저장하게 된다. UserInfo.js 로그인이 성공적으로 되면 페이지 이동을 하기 때문에 자동적으로 렌더링을 할 것이라 생각했고 위의 코드처럼 조건부 렌더링을 해놓으면... navLocationloginReactuseLocationLocation
[React] GNB 현재 위치 표시 현재 사용자가 어느 페이지에 있는지 표시하기 위해 페이지 이동 할 때마다 GNB color 변경 페이지 이동은 Link로, color 변경은 onClick 으로 단순하게 생각했었다. 페이지에 머무르는 동안에는 GNB color를 유지해야 하고, 페이지 이동 할 때마다 color가 변경되어야 하니 useState로 color 값을 관리하려고 생각했다. 페이지 이동하면서 컬러도 바뀌지만 onCl... 페이지 이동pathnameGNB coloruseLocationlinkGNB color [React #13] 동적 라우팅과 Path Parameter, 그리고 관련 Hooks 도메인 주소 끝에 해당 아이템의 id값이 추가되어 페이지를 이동하고, 이동한 페이지에서는 id값에 해당하는 데이터가 보여지는 것을 볼 수 있다. -> url 을 살펴보면 url 마지막에 특정 id 값이 들어가고(/32692, /53424), 해당 id 값에 따라 서로 다른 상세 페이지 정보가 화면에 그려지는 것을 볼 수 있다. id 값에 따라 무수히 많은 url 이 나타날 것이고, 각각의 모... 동적 라우팅path parameteruseNavigateTILReactdynamic routinguseParamuseLocationReact 로그인 성공 후 Nav 상태 변경 로그인을 성공하면 '로그인, 회원가입' 버튼이 유저의 닉네임과 로그아웃 버튼으로 변경이 되어야한다. Nav 로그인 전 이미지 Login.js 일단 로그인이 성공하면 백엔드에서 토큰을 전달받게 되고 전달받은 토큰을 세션스토리지에 저장하게 된다. UserInfo.js 로그인이 성공적으로 되면 페이지 이동을 하기 때문에 자동적으로 렌더링을 할 것이라 생각했고 위의 코드처럼 조건부 렌더링을 해놓으면... navLocationloginReactuseLocationLocation