KIDS (Kakao Insure Design System)

Frontend 공통으로 사용되는 디자인 시스템 모듈입니다. Figma에서 정의된 내용을 따릅니다.

실행환경

• node: 14.18.3
• npm : 6.14.12
• storybook: 6.3.12

실행하기

storybook 을 이용해 개발환경을 구동합니다.

npm run storybook

jest를 이용한 unit test는 아래와 같이 실행합니다.

npm run test

파일구조

...

Git Hook 설정

터미널에서 아래의 명령어를 실행 해 줍니다.

git config core.hooksPath .githooks

Git 브랜치 정책

Git Flow 를 사용하도록 합니다. 예외가 있다면 변경 가능합니다.

feature/{날짜}-{이름}

배포하기

버저닝은 Sementic Versioning (SemVer) 2.0.0 가이드를 따릅니다. (https://semver.org/#semantic-versioning-200)

| Status | Stage | Rule | Example | | ------------------------------------- | ----------- | ------------------------------------------------------------ | ------- | | 첫 배포 | 새로운 제품 | 1.0.0 으로 시작 | 1.0.0 | | 이전 버전과 호환되는 버그 수정 | 패치 배포 | 세 번째 숫자 증가 | 1.0.1 | | 이전 버전과 호환되는 새로운 기능 | 마이너 배포 | 중간 자릿수를 증가시키고 마지막 자릿수를 0으로 재설정 | 1.1.0 | | 이전 버전과의 호환성을 깨는 변경 사항 | 메이저 배포 | 첫 번째 숫자를 증가시키고 중간 및 마지막 숫자를 0으로 재설정 | 2.0.0 |

기본 배포 흐름

1. 배포는 항상 master 브랜치에서 진행함을 원칙으로 합니다. git pull origin master 명령어를 입력하여 remote 브랜치, local 브랜치의 sync 를 맞춥니다.
2. 첫 배포일 경우 npm run login 명령어를 사용하여 로그인해줍니다.
3. npm run build 명령어를 실행하여 빌드합니다.
4. 배포 종류에 따라 아래의 명령어를 실행하면 위 표의 Rule 에 따라 버전이 수정됩니다. (Git working directory 가 비어있어야 합니다.) 자동으로 해당 버전에 맞게 git tag 가 생성이 됩니다.

• 패치 배포: npm version patch
• 마이너 배포: npm version minor
• 메이저 배포: npm version major

5. npm publish 명령어를 입력하여 배포합니다.
6. 배포 완료 이후 git push --tags 명령어를 입력하여 새로 생성된 tag 를 push 해줍니다.

통합 스크립트 활용

기본 배포의 흐름을 이용해 해당 과정을 선형으로 연결한 배포용 스크립트를 제공합니다. 각 단계별로 적합한 스크립트를 호출하면 build를 거쳐

// 패치 빌드 & 배포
npm run publish:patch

// 마이너 빌드 & 배포
npm run publish:minor

// 메이저 빌드 & 배포
npm run publish:major