nextjs/Why-using-a-tag-in-nextjs-Link/

[utterances-bot]

Next.js Link 태그안에 a tag를 안넣어도 왜 잘 작동될까? | uchanlee.dev

Next.js Link의 작동원리에 대해 궁금했던 점을 기록했습니다.

https://uchanlee.dev/nextjs/Why-using-a-tag-in-nextjs-Link/

[FromGoodEnoughYounGyeom]

와 저도 next.js 사용하면서 a태그를 안넣어도 link가 되는게 왜그럴까 했는데 !! 이렇게까지 여러가지 예시로 정리해주셔서 감사합니다. 많이 배우고 이해하고 갑니다!

[woochanleee]

도움이 됐다니 기쁘네요!😊

[feel0321]

저도 이 부분이 궁금했습니다.
'그냥 리액트에서 개선한거니까 뭐 리액트문법처럼 Link써도 되겠지 결과도 같은데' 하고 넘어가려다가 혹시 몰라 검색해보고 들어왔습니다.
호기심을 그냥 넘어가지 않고 라이브러리까지 다 뜯어보시다니 저도 이런 자세를 배워야할 것 같습니다.

next js의 Link는 string만 적을경우 a태그를 추가해준다는건데
개발자가 a태그를 사용하는것이 연산을 한줄이라도 줄이는것같아서 a태그를 써야겠네요.

좋은글 감사합니다.

[woochanleee]

저도 이 부분이 궁금했습니다.
'그냥 리액트에서 개선한거니까 뭐 리액트문법처럼 Link써도 되겠지 결과도 같은데' 하고 넘어가려다가 혹시 몰라 검색해보고 들어왔습니다.
호기심을 그냥 넘어가지 않고 라이브러리까지 다 뜯어보시다니 저도 이런 자세를 배워야할 것 같습니다.

next js의 Link는 string만 적을경우 a태그를 추가해준다는건데
개발자가 a태그를 사용하는것이 연산을 한줄이라도 줄이는것같아서 a태그를 써야겠네요.

좋은글 감사합니다.

읽어주셔서 감사합니다!

[kim-taewoo]

이 부분 궁금해서 찾아보고 있었는데 같은 고민하신 분이 역시 있었군요. 그런데 결론이 약간 애매합니다 ㅠㅠ 결국 알아서 래핑해준다면 굳이 a 태그를 안 넣어줘도 되는 거 아닌가 싶은데.. 가독성 측면에서 굳이 a 태그 없는 게 깔끔하기도 하고요. a 태그를 포함한 복잡한 커스텀 컴포넌트를 사용해서 passHref 를 적용하는 그런 케이스가 아니라 단순 string 링크라면 a 태그를 안 넣는 게 낫지 않을까 싶은데 왜 공식 문서에서는 굳이 a 태그들을 넣어놨는지.. 혼란스럽네요

[woochanleee]

이 부분 궁금해서 찾아보고 있었는데 같은 고민하신 분이 역시 있었군요. 그런데 결론이 약간 애매합니다 ㅠㅠ 결국 알아서 래핑해준다면 굳이 a 태그를 안 넣어줘도 되는 거 아닌가 싶은데.. 가독성 측면에서 굳이 a 태그 없는 게 깔끔하기도 하고요. a 태그를 포함한 복잡한 커스텀 컴포넌트를 사용해서 passHref 를 적용하는 그런 케이스가 아니라 단순 string 링크라면 a 태그를 안 넣는 게 낫지 않을까 싶은데 왜 공식 문서에서는 굳이 a 태그들을 넣어놨는지.. 혼란스럽네요

본문에 첨부되어있는 링크인데 https://github.com/vercel/next.js/blob/canary/packages/next/client/link.tsx#L226
확인해보시면 아래 내용의 주석이 있는데요,

• Deprecated. Warning shown by propType check. If the children provided is a string (example) we wrap it in an tag

공식적으로 deprecated 명시함으로써 권장하지 않는다면 나중 버전에서 문자열만 줬을 경우 자동 a 태그로 감싸주는 "안전 코드?"가 사라질 수 도 있을것 같아요. 따라서 Next에서 바라는 next/link 컴포넌트의 사용 방식은 a 태그를 명시적으로 작성 해주는것 같다는 개인적인 의견입니다!

[kim-taewoo]

공식적으로 deprecated 명시함으로써 권장하지 않는다면 나중 버전에서 문자열만 줬을 경우 자동 a 태그로 감싸주는 "안전 코드?"가 사라질 수 도 있을것 같아요.

결국 nextjs 에서 생각하는 방향이 a 태그를 명시하는 게 맞다는 것 같네요. 받아들여야죠 ㅎㅎ

[wfedev]

저의 경우는 a tag 안에 이미지나 svg가 들어있을 경우, 접근성 관련해서 대체텍스트를 span으로 따로 적용해서 숨겨야하기 때문에 로 감싸는 것이 필요했습니다. 재밌는 글 감사합니다 :)

[yoonjong-park]

이런 자세를 배우고 갑니다.

[junho0956]

저도 궁금해서 찾아보려고 검색했더니
이렇게 좋은 글을 빠르게 발견하게 되어.. 궁금증 해결하고 갑니다!
개발하시는 자세 본받고 갑니다!!

[ssinking91]

와 미쳤다.!!! 저도 궁금해서 지금 구글링 중이었는데 너무 감사합니다.!!!