styled-components 1

태그에 스타일 주는 방법

html파일에서 클래스나 아이디를 부여

계속 import 해야함

유지보수하기 힘듬

 

style을 사용하여 객체 형태로 부여

가독성이 떨어짐

 

3. css in js

모든 파일을 import 해줄 수 있음

조건문, 변수 등 다양한 로직을 작성할 수 있음

 

기본 사용법

최상단에 import styled from 'styled-components' 입력

→ const 변수 = styled. 표준태그 `

      속성: 값;

      속성: 값;

      속성: 값;

    `

→ 변수를 표준태그처럼 사용

    <변수></변수>

 

 

+ 표준태그 말고 함수도 입력할 수도 있다.

const 변수 = styled. ('함수')`

      속성: 값;

      속성: 값;

      속성: 값;

`