본문 바로가기

Program/React6

[next.js] version 13, head.js twitter card, 또는 sns에 웹페이지를 공유 할때 미리보기 기능이 제공된다. 이것을지원 하기 위해서는 CSR에서는 방법을 찾지 못하였다. 플랫폼에서 자바스크립트 로딩을 지원하지 않기 때문이다. nextjs 13에서는 head를 사용 하는 방법이 변경 되었다. head에서 데이터를 로드해 필요한 내용을 출력할수 있다. In the pages directory, the next/head React component is used to manage ) } After: app/head.tsx export default function Head() { return ( My Page Title ) } 2023. 1. 6.
[next.js] version 13, head.js In the pages directory, the next/head React component is used to manage ) } After: app/head.tsx export default function Head() { return ( My Page Title ) } 2023. 1. 2.
[next.js]An error occurred in the Server Components render. An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error. 위의 에러가 발생했다. 해경방법 나의 경우에는 async로 data를 가져올때 로드전에 html에 데이터를 뿌려주면서 에러가 발생한것 같다. dev환경에서는 에러가 없었지만, vercel에서 배포시에 에러가 발생했다. 해결방법은 fetch한 da.. 2023. 1. 2.
react-intersection-observer for loading more data(스크롤 데이터 로딩) https://github.com/thebuilder/react-intersection-observer#readme GitHub - thebuilder/react-intersection-observer: React implementation of the Intersection Observer API to tell you when an eleme React implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport. - GitHub - thebuilder/react-intersection-observer: React implementation of the Inter... git.. 2022. 12. 22.