쇼핑몰 웹사이트 만들기(5)-styled component 설치하기

https://styled-components.com/docs/basics

styled-components: Basics

공식문서를 참고해 styled component를 설치해보자

 

npm install --save styled-components

설치 후, package.json 파일에 "styled-componets"가 생기면 성공!

 

이제 styled-componet를 사용해보자

import  styled  from 'styled-components';

const Title = styled.h1`
font-size : 1.5em;
text-align: center;
color : palevioletred;`;

const Wrapper = styled.section`
  padding: 4em;
  background: papayawhip;
`;

function Main() {
  return (
    <div>
      main
  <Wrapper>
    <Title>
      Hello World!
    </Title>
  </Wrapper>
    </div>
  
  )
}

export default Main

 

실행화면

styled-componet도 설치 끝!