Destructuring props in styled-components

JavaScriptstyled-components

Find yourself writing props. over and over in your styled-components? Destructure them to reduce the noise.

const Post = styled.article`
  background: ${props =>
    props.isFeatured ? props.theme.yellow : props.theme.white
  };
`;

const Post = styled.article`
  background: ${({ isFeatured, theme }) =>
    isFeatured ? theme.yellow : theme.white
  };
`;

More fire tips

Relative timestamps with Intl

With JavaScript’s built-in formatter for relative timestamps, we can build strings like “2 months from now” without having to use third party libraries.

JavaScript
Read fire tip

Read all fire tips →