KRDS 를 직접 구현하며 학습하는 목적을 갖는 프로젝트입니다.
- krds를 충실히 구현하는 프로젝트를 만들어 누구나 간편하게 디지털 정부서비스
UI/UX 가이드라인을 만족하는 프로젝트를 쉽게 구현하는 것을 돕습니다. - 접근성을 충분히 고려하고 학습합니다.
- 테스트를 작성해 목표를 명확히하고 안정성을 증명합니다.
기여하는 방식은 다음과 같습니다.
- 구현하고자 하는 컴포넌트를 선택합니다.
- issue를 생성합니다.
- issue에는 구현하고자 하는 컴포넌트와 링크를 첨부합니다. ex) Accordion: link
- issue 하단에 구현을 과정을 구체적으로 첨부합니다. radix-ui같은 라이브러리를 사용할 예정이라면 이를 기입합니다. 3. (옵션) 테스트 항목을 기입합니다.
- issue를 기반으로 branch를 생성하고 PR을 올립니다. 다음의 내용이 포함되어야합니다.
__{componentName}__.stories.tsx파일__{componentName}__.spec.tsx파일 (옵션){componentName}.tsx파일
- PR을 리뷰 자세한 내용은 CONTRIBUTING 문서를 참고해주세요. (작성 예정)
Caution
pnpm storybook로 스토리북을 열 수 있습니다.
pnpm react test 혹은 pnpm react:test로 테스트를 수행할 수 있습니다.
- masthead (@dev2820)
- identifier (@dev2820)
-
footer(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움) -
header(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움)
- skip link (@dev2820)
-
main menu(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움) - breadcrumb (@dev2820)
- side navigation
- in-page navigation
- pagination
- structued list
- critical alerts
- calendar
- disclosure (@dev2820)
- modal (@dev2820)
- badge (@dev2820)
- accordion (@dev2820)
-
image(X, 구지...?) - carousel
- tab
- table
- radio button
- checkbox
- select
- tag (@dev2820)
- step indicator
- spinner (@dev2820)
-
help panel(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움) -
tutorial panel(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움) -
contextual help(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움) -
coach mark(X, 너무 복잡해서 재사용성 있는 컴포넌트로 보기 어려움)
- date input
- textarea
- text input
- file upload