2021.09.19 TIL

정관우·2021년 9월 19일
0
post-thumbnail

😎 Things I Learned

✓  Styled-Components의 Extend & Nesting
Styled-Components에서 CSS 속성을 상속받는 법과 HTML 태그를 Nesting하는 법을 배웠다.

✓  Theme을 이용하여 CSS 속성 저장 및 변경
여러 번 사용되는 속성 값들 ( color, border, background 등)을 Theme으로 설정해준 다음, 컴포넌트에서 재사용하는 하는 법을 배웠다.

✓  Shared Component로 코드 재사용
버튼이나 입력 폼 같이 반복적으로 사용되는 같은 컴포넌트를 파일로 분리하여 재사용하여 코드를 효율적으로 작성하는 법을 배웠다.

🤔 Things To Remember

✓  중복되는 여러 CSS 속성은 컴포넌트화
모든 CSS 속성들을 무조건 컴포넌트로 만들기보다는 일단 Nesting을 해준 다음 중복되면 따로 컴포넌트로 만드는 것이 좋다.

✓  children이나 props 구조분해 할당을 이용하여 재사용 가능한 컴포넌트 만들기
React 컴포넌트의 children을 이용하면, 자식 컴포넌트에 접근할 수 있다. props를 spread syntax로 내려주면 모든 props를 다른 컴포넌트로 그대로 전달할 수 있다. 이를 이용하여, 재사용 가능한 컴포넌트를 자유롭게 만들 수 있다.

✓  파일 나누기
중복되는 UI는 어디에 쓰이는 지에 따라 폴더 단위로 분리하여 저장하면 좋다.

🤓 Things To Do

✓  Shared Components 로직 복습
✓  Login 부분 블로깅
✓  Sign Up까지 구현 마치기

profile
작지만 꾸준하게 성장하는 개발자🌳

0개의 댓글