Next.js는 서버사이드와 클라이언트 사이드가 공존하기 때문에, env파일을 사용할 때에 서로 다른 형태를 취한다
우선 서버사이드 렌더링에서 env파일을 사용하려면, node.js에서 하던것처럼 process.env로 접근하면 된다
단, 서버사이드 랜더링과 관련된 곳에서만 가능하다. (getStaticProps, getServersideProps와 같은)
서버사이드에서 미리 페이지를 렌더링을 할 때, 외부 데이터를 받아와야 할 필요성이 있을 경우, 해당 데이터를 그대로 받아서 pre-rendering 시킨다. 빌드 이후에는 해당 값으로 계속 고정되어버리기 때문에 변경되지 않는다. (revalidate 옵션을 설정하면 특정 주기별로 업데이트를 체킹하도록 만들 수 있다)
서버사이드에서 미리 데이터를 패칭받아 pre-rendering을 할 때, 매 요청 때마다 새롭게 데이터를 받아서 페이지를 랜더링을 한 후에 유저한테 전달한다.
서버사이드에서 환경변수를 사용할 경우, process.env는 특수한 형태의 자료구조이고 객체가 아니기 때문에, destructuring을 하는 행위를 피해야 한다.
추가적으로, 환경변수 영역 내에서 환경 변수 참조가 가능하다. 이때 참조를 하기 위해서는 "$" 표시를 앞에 붙이면 된다.
(다시말하면, 만약 변수에 $ 가 들어가야 할 상황이 있다면 이것이 $ 변수참조가 아니라는 의미로 "$" 형태로 쓰여져야 한다.)
클라이언트 사이드에서 환경변수를 노출시켜야 하는 경우, next.js에서 요구하는 특수한 prefix를 붙여서 설정해야 한다.