반응형 리액트3 styled-components 알차게 사용하기 이번에 정리할 내용은 styled-components가 가진 기능들을 보다 알차게 사용하는 법에 대한 것이다. styled-components는 각각의 컴포넌트들을 생성하고 그 컴포넌트들의 css를 바로 작성할 수 있게 해주는 라이브러리이다. 기존의 css나 태그의 style 속성을 사용할 때는 변수를 사용할 수 없었지만, styled-components를 사용하면 컴포넌트이기 때문에 props로 값을 받아 변수처럼 사용할 수 있다. import styled from 'styled-components'; const ImageBox = () => { return( ); }; const Image = styled.div` width: 10px; height: 10px; background: url(${pro.. 2021. 4. 22. 크롬 익스텐션 개발기(2) : webclipper 우리 프로그램의 주된 기능은 webclipper 기능이었다. 즉, 익스텐션의 파비콘을 클릭했을 때 해당 탭의 html 정보를 긁어오는 과정이 필요하였다. 그래서 나는 이 기능을 구현하기 위해 나는 background 부분과 chrome API를 이용하였다. developer.chrome.com/docs/extensions/reference/ API Reference - Chrome Developers The complete reference to all APIs made available to Chrome Extensions. This includes APIs for the deprecated Chrome Apps platform as well as APIs still in beta and dev. de.. 2021. 1. 25. 크롬 익스텐션 개발기 (1) : 기본 설정 3주간 동아리에서 팀 프로젝트로 웹 클리퍼 기능의 크롬 익스텐션을 개발하게 되었다. 크롬 익스텐션 개발과 관련된 정보가 많은 것이 아니라 힘들기도 했지만, 만들고 나니까 굉장히 뿌듯하다. 그래서 크롬 익스텐션을 만들면서 배웠던 내용들을 전체적으로 정리해보고자 한다! 일단 이 프로젝트를 진행하면서 chrome API 문서를 엄청 읽었다. developer.chrome.com/docs/extensions/reference/ API Reference - Chrome Developers The complete reference to all APIs made available to Chrome Extensions. This includes APIs for the deprecated Chrome Apps platf.. 2021. 1. 17. 이전 1 다음 반응형
