@modern-kit
는 클라이언트 개발에 유용한 리액트 컴포넌트
, 커스텀 훅
및 유틸리티 함수
, 타입
을 제공하는 라이브러리입니다.
클라이언트 개발에 필요한 모듈들을 제공하는 것 뿐만아니라, 다양한 레퍼런스를 제공
하기 위한 목적을 갖고 있습니다.
@modern-kit
는 Next.js의 SSR(Server Side Rendering)
환경에서도 호환되는 등 CJS(CommonJs)
환경에서도 호환되기 위해 CJS(CommonJs)
와 ESM(ECMAScript Module)
두 포맷을 모두 지원합니다.
@modern-kit
은 한국인들의 접근성을 높이고 진입 장벽을 낮추기 위해, 한국어만을 지원
합니다. (wip. 영어로 작성된 부분들을 단계적으로 한국어로 교체 할 예정입니다.)
@modern-kit
의 공식 문서는 아래 웹사이트에서 확인하실 수 있습니다
- React와 관련된 유용한
컴포넌트
와커스텀 훅
을 제공하는 라이브러리입니다.
npm i @modern-kit/react
yarn add @modern-kit/react
pnpm i @modern-kit/react
- 클라이언트 개발과 관련된 유용한
유틸리티 함수
를 제공하는 라이브러리입니다.
npm i @modern-kit/utils
yarn add @modern-kit/utils
pnpm i @modern-kit/utils
- 유용한
유틸 타입
들을 제공하는 라이브러리 입니다.
npm i @modern-kit/types
yarn add @modern-kit/types
pnpm i @modern-kit/types
root
폴더에서 진행해주세요.- 패키지 매니저는
yarn berry
, Node 버전은v20
을 사용하셔야 합니다.
yarn eslint packages
- 위 명령어를 통해 모든 패키지의
lint
검사를 진행할 수 있습니다.
yarn test
test
명령어를 통해vitest
와react-testing-library
로 테스트를 진행할 수 있습니다.
yarn typecheck
typecheck
명령어를 통해typecheck
를 진행할 수 있습니다.
yarn build
build
명령어를 통해 관리하는 모든 패키지들의 build, 상단의 lint, test, typecheck를 모두 진행합니다.
- @modern-kit/utils의 경우
benchmark
테스트를 진행 할 수 있습니다. packages/utils
폴더에서 아래 명령어를 실행하면전체 benchmark 테스트 코드
를 실행 할 수 있습니다.
yarn test:bench
개별 benchmark 테스트 코드
를 실행하려면 아래와 같이 실행 할 수 있습니다.
yarn test:bench flatten.bench.ts
- @modern-kit은 docusaurus를 기반으로 문서화 작업을 진행합니다.
yarn start:docs
start:docs
명령어를 통해 개발 서버를 실행해 문서 작업을 미리 확인 할 수 있습니다.
yarn build:docs
build:docs
명령어를 통해 document build를 진행합니다.- 신규 문서 작업 후 해당 build 작업이 정상적으로 진행되어야 합니다.
모든 기여에 감사드립니다! 누구든지 라이브러리에 기여할 수 있습니다. Contributing Guide
Yarn Berry(v4)
와workspaces
를 활용해 Monolithic Repository 환경을 구축- packages 내부의 패키지들은 로컬 패키지처럼 상호 의존성을 갖습니다.
lerna
를 활용한 통합 빌드, 통합 테스트, 통합 배포 환경 구축github actions
를 활용한 CI/CD 구축changeset
을 활용한 모노레포 환경에서 패키지 일관성 유지 및 NPM 배포 진행dependabot
을 활용한 자동 의존성 관리codecov
를 활용한 테스트 코드 커버리지 리포트 및 신뢰성 있는 코드 제공docusaurus
를 활용한 공식 문서 제공vitest
를 활용한 테스트 코드 작성 및 테스트 진행- @modern-kit/utils의 경우
Benchmark
테스트 포함
- @modern-kit/utils의 경우
MIT © Modern Agile. See LICENSE for details.