Next.js에서 스타일 적용하는 방법에 대해 알아보겠습니다. CSS-in-JS 가장 간단한 방법은 인라인 스타일입니다. export default function Home() { return ( Hello ); } CSS Modules Next.js는 [name].module.css 파일 명명 규칙을 사용하여 CSS Module을 지원합니다. Common.module.css 파일을 생성하고 스타일을 아래와 같이 작성합니다. 중요한 것은 .module.css 패턴을 사용하는 것입니다. .nav { display: flex; justify-content: space-between; background-color: red; } .text { color: blue; } 생성된 module을 import 해서 ..

React에서 Styled Components를 사용하는 방법에 대해 알아보겠습니다. 설치 Visual Studio Code를 사용 시 Styled-Component 자동 완성을 위해 vscode-styled-components 플러그인을 설치합니다. $ npm i styled-components https://styled-components.com/ 사용 예 import styled from 'styled-components'; const Father = styled.div` display: flex; `; const BoxOne = styled.div` background-color: teal; width: 100px; height: 100px; `; const BoxTwo = styled.div` ..