# styled component
스타일드컴포넌트 복잡하게 쓰기
내가 사랑하는 css 라이브러리인 styled-component진짜 짱인거같다..너무 편하고..코드도 깔끔하다처음배울땐 사용법이 너무 한정적인것 아닌가, 싶었는데 쓰면쓸수록 무궁무진함에 놀라는 녀석이다보통은 이런식으로 사용하곤 하는데, 이렇게 단순한 것을이렇게 elem
TIL 22-05-01
뉴스뷰어 완성 (axios, styled-components) + react-router (NavLink를 styled(NavLink)로 사용함)
TIL 22-04-30 (2)
외부 API 연동 (async/await, Promise 등 비동기) / axios / styled-components
(Next.js) Next 앱에서 material ui와 styled-component를 적용하기
Next.js에서 mui와 styled-components 적용하기 좌충우돌 스토리
Styled Component
기존에 scss를 사용해서 스타일링을 했는데,컴포넌트 파일 1, scss파일 1해서 컴포넌트마다 파일이 2개가 되면서 관리하기가 불편하다.또, 클래스네임이 중복으로 되면 스타일이 의도대로 나오지 않는다.이래서 사용하면 좋은게 Styled Component ! 라이브러리
[Next js] Warning : Props 'className' did not match
요런 에러가 떴다.내가 Tailwind 를 쓰면서 className 쪽 에러를 발생하게했나? 싶어서 모든 코드를 훑으며 디버깅을 했는데.. 알고보니 styled component 문제였다^^ 핳핳 잊어버리지 않게 기록하려한다!출처 를 보고 문제를 해결했다.. 정말 감
[Devlog] Netflix clone coding : 문제와 해결법
문제 : 연속된 Slider 컴포넌트가 리렌더 되면서 엉뚱하게 Modal의 option 속성 또한 마지막 것으로 교체되어버렸다;; 그래서 matchedMovie와 layoutId까지 덩달아 매칭되지 않아 애니메이션이 깨지는 문제가 발생했다. 해결 : useRoute
[SeSAC DT 과정] REACT - CSS Module, Styled-component 사용하기
css 클래스명의 중복을 막아주는 css-module 과 css 관련 리액트 라이브러리인 styled-component 에 대해서 학습해보자. 리액트
[Styled-Component] return css`...` 사용!
return css`` 를 사용해서 토글 만들기 완성된 토글 공통 code css 사용한 styled code css 사용하지 않은 styled code
22.03.03
일단 사용할 곳에서 import를 한다styled component는 css와 문법이 같지만, 만들 때 랜덤한 tag를 만들어주기 때문에 중복이 되지 않아서 좋다.사용하는 곳에서는 이런 식으로 사용해주면 된다.일단 쓰려고 하는 styled component를 impor
[Styled-component] 다른 컴포넌트에 영향받는 스타일
부모 자식, 형제 관계가 아닌 서로 동 떨어진 컴포넌트에 영향받는 스타일링을 해야하는 상황선택자를 통해 하위 선택자, 자식 선택자, 형제 선택자, 인접 형제 선택자를 선택 할 수 있음하지만 저기 멀리 다른 박스에 위치해있는 컴포넌트에 영향을 받고 싶다면 방법이 없다스타
영양제 검색창 구현
프로젝트 GitHub 레파지토리정해진 데이터를 가지고 사용자 입장에서 편한 결과를 보여줄 수 있도록주어진 데이터를 활용한 검색창 구현2022.02.17 ~ 2022.02.19TypeScriptReactRedux-toolkitStyled-component한글로 입력된 영
TIL-Styled Component
조금이나마 적응되었던 sass를 뒤로 한채새로운 Styled-component를 사용하기 시작했다.처음에는 도무지 머릿속에 박스들이 그려지지 않아 헤맸는데지금은 쓰는게 익숙해졌다.유지보수에 매우 용이하다고 하는데, 체감이 되지 않아 sass를 그리워했다..근데 계속하다