🤍 은지log 🤍

Next.js의 getStaticProps와 getStaticPaths api를 사용하면 static 페이지를 생성할 수 있다. getStaticProps: 빌드 시 데이터를 fetch하여 static 페이지를 생성 getStaticPaths: pages/**/[id].tsx 형태의 동적 라우팅 페이지 중, 빌드 시에 static하게 생성할 페이지를 정함 🔆 getStaticProps .tsx에서 export async function getStaticProps(context) 형태로 사용. context.params로 동적 라우팅의 경로 이름을 가져온다. pages/posts/[id].tsx 페이지를 /posts/123으로 접근했다면 context.params는 { id: "123" }이 된다. { p..

Next.js에서 제공하는 SSR, 하지만 우리는 SSR에서 사용하지 못하는 객체인 window 객체를 사용할 때가 많습니다. 그럴때 해결하는 방법 ! 1. typeof 를 사용. if(window){...} // window is not definde 에러발생 if(typeof window !== undefined) {...} // 정의되지않은 window의 타입이기떄문에 undefied가 발생 -> 에러가 발생하지 않습니다. 간단하게 이러한 방법으로 window객체가 있는지 체크하는 방법이 있습니다. 2. useEffect를 사용. useEffect(()=>{ // 안에서 window 객체를 사용 },[]) useEffect는 DOM형성 후에 실행이 되는 hook입니다. 고로 브라우저가아닌 서버에서 ..