전체 글

매일 어제보다 1mm만큼 더 성장해나가는 프론트엔드개발자
NextJS

nextjs [slug] 페이지에서 Link href 경로가 잘못 나올 때

Nextjs에서 [slug].tsx페이지에서 href 경로가 잘못 나오는 문제가 있었다. 이 경로를 통해서 들어와지는 newsview라는 페이지가 있다. 파일 구조는 이러하다. 근데 [slug]페이지 (newsview페이지)에서 href 경로가 이상하다. 나는 /newsview/페이지를 넣지 않았는데 왠...???? 결론적으로는 `/${ 내용 }` 으로 넣어야 경로가 바르게 나온다. `/${item.link}`

Javascript

map으로 배열의 마지막 요소에만 속성 다르게 주기

.map 을 사용하여 컴포넌트를 만드는데 마지막 컴포넌트만 다른 속성값을 주고 싶었다. 마지막 요소에만 유일하게 href값이 있었고, 새 창에서 띄워야 했기때문이다.. const MenuContent = [ { menuName: 'Overview', }, { menuName: 'Features', }, { menuName: 'References', }, { menuName: 'Release Note', href: 'DeepCatchReleaseNote', }, ]; Array.length === index + 1 로 배열의 마지막 요소에 접근해서 컴포넌트를 따로 출력했다. {MenuContent?.map((item, index) => { if (MenuContent.length === index + 1)..

카테고리 없음

220308 개발일지

핸드폰으로 nextjs localhost 접속 그동안 리액트에서 localhost:3000으로 서버를 띄우고 회사 와이파이를 같은 것으로 둔 후 모바일에서 주소창에 localhost:3000으로 접속해서 테스트 하곤 했다. Next.js로 변경 후 한동안 안되는 문제가 있다가 오늘 해결했다. npx next dev -p 3000 이렇게 터미널에 치고는 같은 와이파이로 연결해서 예전처럼 접속할 수 있었다. 모바일에서 터치 이벤트 wheelEvent를 이용해서 웹에서 delta.Y > 0 혹은 delta< 0 로 이벤트 처리하는게 있었는데 모바일에선 안됬다. 모바일은 touchEvent가 있었다.. touchEvent를 웹에선 하기 어려워서 방법을 찾았다. 아이폰을 맥에 연결하여 사파리에서 ios 테스트를 ..

Mori_FEDev
모리 로그