How Can I Reuse React Component?

16기 김동하·2021년 1월 24일
0

✔️ 컴포넌트 재사용을 통해 컴포넌트 구조를 효율적으로 설계할 수 있다.
✔️ 컴포넌트가 넘겨받는 Props 값에 따라 서로 다른 UI를 보여줄 수 있다(조건부 렌더링).
✔️ props.children의 사용법에 대하여 이해한다.

:: 로그인 :: 회원가입

  • 폼 레이아웃 - 로고 - 타이틀
    (로그인) - Input 박스 (이메일,
    비밀번호) - 로그인 버튼 - 계정
    찾기 / 회원가입 문구 - 소셜 로
    그인 버튼
  • 폼 레이아웃 - 로고 - 타이틀
    (회원가입) - Input 박스 (이름,
    이메일, 비밀번호) - 회원가입
    버튼 - 로그인 문구 - 소셜 로그
    인 버튼
    볼드 / 하이라이트 처리한 항목은 변화하되 두 요소들에서 반복적으로 사용되는 요소
    들입니다.
    변화하는 부분들이 있다고 하더라도 매번 다른 코드로 처리할 필요 없이 컴포넌트화
    하여 사용할 수 있습니다.
      1. [수][React] How Can I Reuse React Component?
        https://www.notion.so/React-How-Can-I-Reuse-React-Component-f808df453fec45e494bd39d888d73530 4/8
        // before -> 두 개의 내용을 표현하기 위한 두 개의 파일 isMyID ? : // after -> 두 개의 내용을 표현하기 위한 하나의 파일
        const MY_ID = '12345' const OTHER_ID = '54321' isMyID ? :
profile
예비 개발자에서 개발자로!

0개의 댓글