스타일 컴포넌트 GlobalStyle 사용하기

리액트 GlobalStyle 사용하기

GlobalStyle 사용하는 이유 : style component로 컴포넌트들을 스타일링 할 때, html, body, #root 등의 엘리먼트를 스타일링 하기 위해서

1. Styled Components 설치

npm install --save styled-components

1. createGlobalStyle를 import 한다.

import { createGlobalStyle } from "styled-components";

1. GlobalStyle 작성

const GlobalStyle = createGlobalStyle`
	body {
		padding: 0;
		margin: 0;
	}
`;

1. GlobalStyle 컴포넌트 넣기 (감싸는 것 아님!!)

<>
  <GlobalStyle />
  <App />
</>

리액트 Styled Components - 1편