[day07]
zip폴더 압축 풀고 yarn or ( npm )
cd day07
yarn
yarn add styled-components
yarn add axios
yarn add sass
yarn add react-bootstrap
yarn add bootstrap
yarn add @material-ui/core
yarn start ( npm start )
------------------------------------------
styled-components css 자동완성기능 설치
https://marketplace.visualstudio.com/items?itemName=jpoissonnier.vscode-styled-components
styled-components
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅🏾
styled-components.com
yarn add styled-component
import styled from 'styled-components'
React 프로젝트에서 styled-components 모듈에서 styled를 불러온 후,
HTML 요소 이름을 추가한 다음 백틱(`) 기호로 감싼 영역에 CSS 코드를 작성하면
CSS 스타일이 반영된 React 컴포넌트를 만들어 낼 수 있음
형식)
import styled from 'styled-components'
const StyledH2 = styled.h2`
color: #06f;
font-size: 14px;
`
그리고 styled.h2는 다음과 같이 변경해도 동일하게 작동
const StyledH2 = styled('h2')`
color: #06f;
font-size: 14px;
`
-------------------------------------------