[Next.js] next.js 14에 emotion 적용하기
next.js 14에서 app 라우터가 정식 출시되며 CSS-in-JS 적용 방법도 달라졌습니다. 공식 문서에 따르면, CSS-in-JS는 클라이언트 전용이고, 서버 컴포넌트에서는 사용 불가능하다 합니다. 대부분의 라이브러리는 next.js에서의 CSS-in-JS를… 더 보기 »[Next.js] next.js 14에 emotion 적용하기
next.js 14에서 app 라우터가 정식 출시되며 CSS-in-JS 적용 방법도 달라졌습니다. 공식 문서에 따르면, CSS-in-JS는 클라이언트 전용이고, 서버 컴포넌트에서는 사용 불가능하다 합니다. 대부분의 라이브러리는 next.js에서의 CSS-in-JS를… 더 보기 »[Next.js] next.js 14에 emotion 적용하기
기존의 React 애플리케이션은 대부분 클라이언트 측에서 작동하여 데이터 처리와 렌더링을 브라우저에서 수행했다. 하지만 서버 컴포넌트 를 사용하면 클라이언트와 서버 사이에서 컴포넌트를 공유하여 서버 측에서도 컴포넌트를 렌더링할 수 있다.
App Next.js는 페이지를 초기화하기 위해 App 컴포넌트를 사용한다. 이걸 덮어쓰거나 직접 변경할 수 있다. pages/_app.tsx 내의 코드를 수정하면 모든 페이지에 공통적으로 적용된다. 주요 사용 목적… 더 보기 »[Next.js] _app과 _document 알아보기
Next.js는 내장 Head 컴포넌트를 설정하여 메타데이터를 설정할 수 있다. 이 컴포넌트는 어떤 컴포넌트에서든 HTML 페이지의 <head> 내부 데이터를 변경할 수 있도록 한다. 즉, 동적으로 메타데이터,… 더 보기 »[Next.js] Head 컴포넌트로 메타 데이터 설정하기