리액트 재사용 컴포넌트

재사용 컴포넌트?

• 컴포넌트는 무엇인가?

  • 의미있는 요소. (modal, calendar, navigation, slider, UI의 독립적인 화면단위 등)

  • React 컴포넌트

• 재사용을 해야하는가?

  • 반복 또는 중복인가?

• 현실은?

  • 화면은 조금만 달라도 재사용은 어렵다. 😣 동작, 스타일 등

재사용성을 올리려면?

• 스타일 의존성 제거

• 간단한 동작으로만 동작, 나머지는 옵션으로 제공

• 동작 전후로 동작하는 훅(hook) API제공

• 여러군데 사용하면서 발전 시키기

• 컴포넌트 중심의 제약조건 만들기

코드

https://codesandbox.io/p/sandbox/reusable-modal-j6e6g

라이브러리 살펴보기

egjs

https://naver.github.io/egjs-infinitegrid/#layouts
https://naver.github.io/egjs-infinitegrid/#components

react-dates

https://www.npmjs.com/package/@datepicker-react/styled
https://github.com/airbnb/react-dates
https://github.com/majapw/react-dates-demo/blob/master/src/App.js