추가한 두 번째 페이지에 현재 스타일이 적용되어 있지 않습니다. 페이지에 스타일을 위한 CSS를 추가해 보겠습니다.
Next.js는 CSS와 Sass에 대한 내장 지원을 제공합니다. 이 강좌에서는 CSS를 사용할 것입니다.
이번 강좌에서는 이미지와 같은 정적 자산(asstes), 그리고 <title> 태그와 같은 페이지 메타데이터를 Next.js가 어떻게 처리하는지도 배우게 될 것입니다.
이번 강좌에서 배우게 될 내용
이번 강좌에서는 다음과 같은 내용을 배울 것입니다:
- Next.js에 정적 파일 (이미지 등)을 추가하는 방법.
- 각 페이지의 <head> 안에 들어가는 내용을 사용자 정의하는 방법.
- CSS Modules을 사용하여 스타일이 적용된 재사용 가능한 React 컴포넌트를 생성하는 방법.
- pages/_app.js에서 전역 CSS를 추가하는 방법.
- Next.js에서 스타일링하는 데 유용한 팁.
전제조건
- 기본적인 CSS 지식. 이 강좌에서는 Next.js 앱에 CSS를 추가하는 방법을 다룰 것이지만, 기본적인 CSS 기초에 대해서는 다루지 않습니다.
Next.js 스타일링에 대한 자세한 문서는 CSS 문서를 참조하세요.
'Dev > Next JS' 카테고리의 다른 글
[공식문서] NextJS - Assets, Metadata, and CSS #4 (0) | 2023.08.15 |
---|---|
[공식문서] NextJS - Assets, Metadata, and CSS #3 (0) | 2023.08.15 |
[공식문서] NextJS - Assets, Metadata, and CSS #2 (0) | 2023.08.15 |
[공식문서] NextJS 페이지 간 이동하기 #5 (0) | 2023.08.14 |
[공식문서] NextJS 페이지 간 이동하기 #4 (0) | 2023.08.14 |