TIL 2020.08.12

kimfriendship·2020년 10월 7일
0

TIL

목록 보기
120/207
post-thumbnail

Today I Learned...

  1. airdnd

    ✅ 글로벌 컴포넌트
    -styled 슬라이드 버튼 만들기
    -styled 카운터 버튼 만들기

    ✅ theme provider 추가하기

    ✅ 서치페이지
    -레이아웃 잡기
    -숙소 리스트 레이아웃 잡기



Tomorrow I will Learn...

👊 airdnd 프로젝트



QnA

🤷‍♀️‍ hr 스타일링 하기

hr horizontal rule의 두문자어로 콘텐츠 내용이 바뀔 때 문단의 구분을 위해 수평선을 그려주는 요소이다.

hr을 스타일링하는 예제들은 hr w3schools에서 참고할 수 있다.


🤷‍♀️‍ 남는 width만큼 채우기

How to make a div fill a remaining horizontal space를 참고해보니, 나에게 가장 간편한 방법은 flex-grow를 쓰는 것이었다. flex-grow나 flex-shrink는 들어만 봤지 실제로 써본 적은 별로 없는데 이럴 때 쓰는 거였구나!


🤷‍♀️‍ styled component에서의 ...rest

이론적으로 배운 게 아니라 경험에 의해 알게 된 거라 정확한 지는 모르겠지만, 리턴 된(export 시키는) styled component는 스타일을 확장하려면 props에 꼭 ...rest가 있어야 하는 것 같다. #comeback



Comments

  • 스타일드 컴포넌트를 쓰면서 느낀 또 한가지는, 라이브러리를 쓰는 것 같다는 것이다ㅋㅋ 어떤 것들을 필수적으로 프롭스로 넘겨야 하는지, 프롭스의 값으로는 어떤 걸 줄 수 있는지 등 파악이 되지 않으면 컴포넌트를 쓸 수가 없기 때문이다. 이런 것들도 설계 단계에서 미리 협의를 했어야 하는건가ㅠㅠ


profile
👼🏻 Front-end Developer

0개의 댓글