xtring.dev

Styled Components 1. 스타일? Styled Components를 왜 배우는가! SASS 코드를 설치 없이 사용하고 CSS 파일 없이 CSS 코드를 짜고 게다가 이 코드를 React Native 앱으로 공유할수 있습니다. 가장 큰 장점은 기존의 className을 사용하지 않는 것과 컴포넌트에 스타일을 적용하여 스타일 코드를 몰아 넣을 수 있으며 공통 코드를 줄이고 React의 컴포넌트 형태로 사용할 수 있다는 점입니다! 2. 셋업 npx create-react-app 을 통해 환경을 설치합니다. 그리고 /src 디렉토리에 App.js와 index.js을 제외한 모든 파일을 제거합니다. 가장 먼저 버튼을 만드는데 hover, active state, 배경색을 바꿔보겠습니다.(js와 css를..

styled-components를 사용하며 Ant Design를 사용해야하면 아래와 같이 사용해보세요. 기존의 기본 Tag들과 styled-components를 함께 사용하는 방식과 같습니다! 필요에 의해서 사용할 수도 있겠지만 이렇게 사용하는 경우는 크게 없을 것 같네요 🤓 Antd의 class에 일일히 접근해서 모든 스타일을 바꾸는 것 보다 root의 index.css에서 전역으로 Antd 클래스의 스타일을 Tune 해놓은 다음에 사용하는 것이 좋을 것 같습니다! 😎 (저만의 생각입니다..ㅎㅎ)