해당 강좌를 실습한 코드입니다.

Start Date	End Date	Update Date
2018-10-28	2018-10-31 🎃	2018-10-28

#3 injectGlobal and Extend (commit)

• v4에서 injectGlobal가 createGlobalStyle로 변경.

  The injectGlobal API was removed and replaced by createGlobalStyle in styled-components v4. document link

• withComponent() 와 extend()의 사용

  const Anchor = Button.withComponent("a").extend`
      text-decoration: none;
  `;

  위의 코드는 extend is not function 에러가 난다.

  아래 코드와 같이 표현해야 원하는 결과를 얻는다. 참고한 링크

  const Anchor = styled(Button.withComponent('a'))`
      text-decoration: none;
  `;

#4 Animations

v4에서 keyframe은 css-helper를 사용해 코드를 작성해야한다.

참고 : Animation

import styled, { css, keyframes } from "styled-components";
...
${props => {
      if(props.danger){
        return css`animation: ${rotation} 2s linear infinite;`;
      }
  }}