styled-components

styled-components란
컴포넌트에 스타일을 적기 때문에, 간단하고 직관적

return (
     <div className="App">
       <MyStyled>
         <p>im here!!!</p>
       </MyStyled>

//scss 문법 1: 네스팅! 내가 포함하고 있는 요소에 접근할 수 있어요. ex)내 것{ 자식 것: {}}
// scss 문법 2: &는 나 자신!
const MyStyled = styled.div`
  width: 50vw;
  height: 150px;
  background-color: ${(props) => (props.bg_color ? "red" : "purple")};
  p {
    color: blue;
  }
  &:hover{
    background-color: yellow;
  }
`;