HyperUI에 기여하는 방법

어떤 사람들에게는 오픈 소스 프로젝트에 기여한다는 생각이 매우 벅찰 수 있지만 그렇다고 해서 여러분을 미루지 않도록 하십시오. HyperUI에 기여하고 CV/GitHub에서 일부 오픈 소스 작업을 수행하는 방법을 살펴보겠습니다.

버그를 발견했습니까?

약간 이상해 보이는 것을 발견한 경우:

스펠링

접근성

서구

더 많이, 그리고 나서 해주세요 create an issue .

문제가 생성되면 수정 작업을 시작할 수 있습니다. 그러나 수정 작업을 원하시면 저에게 알려주십시오.

무언가를 추가하고 싶습니까?

HyperUI에 추가하고 싶은 것이 있다면 정말 좋습니다. 하지만 개발에 너무 깊이 들어가기 전에 추가할 내용을 대략적으로 설명하는 것이 좋습니다create an issue.

새 구성 요소를 추가할 계획이라면 구성 요소의 모양에 대한 몇 가지 예를 포함하십시오.

풀 리퀘스트 피드백

여기 무서운 부분이 있습니다 👻

모든 끌어오기 요청은 HyperU에 병합되기 전에 검토되어야 하며, 이는 때때로 피드백이 있음을 의미합니다. 피드백에 실망하지 마세요. 우리는 모두 서로의 기술을 개발하고 HyperUI(및 기타 오픈 소스 프로젝트)를 개선하기 위해 노력하고 있습니다.

로컬에서 HyperUI 실행하기

HyperUI는 Next JS + Typescript 프로젝트이며 다음 명령으로 빠르게 설정할 수 있습니다.

git clone [email protected]:markmead/hyperui.git
yarn
yarn dev

CSS를 컴파일해야 하는 일부 변경 작업을 수행하는 경우 새 터미널 창을 열고 다음을 실행해야 합니다.

yarn css:watch

새 구성 요소 만들기

이 예에서는 마케팅 범주에 새 바닥글 구성 요소를 추가합니다.

/public/components/marketing-footers에 새 파일을 만듭니다.

/src/data/components/marketing-footers.mdx의 구성 요소 그룹에 새 구성 요소를 추가합니다.

이렇게 보일 것입니다.

components:
  21:
    title: An Amazing Footer
  22:
    title: My Awesome New Footer ✨

보시다시피 구성 요소 파일의 이름은 점진적으로 지정됩니다. 이 방법을 따르십시오.

필요한 경우 spacing: ...를 사용하여 미리 보기 내에 구성 요소를 배치할 수 있지만 여기에 추가된 모든 클래스는 구성 요소 코드를 복사하거나 볼 때 무시됩니다.

새 구성 요소에 대한 참고 사항

Tailwind CSS로 구성 요소를 작성해야 함

/public/tailwind.css를 변경하지 마십시오.

HTML에서 Tailwind CSS 플러그인 사용 참조

이input component의 HTML에서 3번과 4번 항목의 예를 볼 수 있습니다.

새 컬렉션 만들기

새 컬렉션을 만들고 싶다면 GitHub에서 create an issue 알려주십시오. 그러면 새 컬렉션에 대해 논의하고 추가할 수 있는 구성 요소에 대한 아이디어를 얻을 수 있습니다.

새로운 구성 요소 피드백

HyperUI에 구성 요소를 추가하려는 경우 구성 요소의 디자인과 개발에 대한 피드백을 제공할 것입니다.

새 구성 요소 풀 요청의 경우 작업을 세 번 검토합니다. 세 번째 검토에서 아직 해결되지 않은 첫 번째 검토의 피드백이 있는 경우 해당 검토를 닫고 피드백이 해결되면 다시 열도록 요청할 것입니다.

세 번째 검토에서 새로운 피드백이 있는 경우에는 문제가 되지 않으며 첫 번째 검토에서 피드백을 계속 무시한 경우에만 해당됩니다.

나는 이것이 공정하다고 믿습니다.

최종 노트

오픈 소스에 기여하는 것은 개발자에게 가장 좋은 감정 중 하나이지만 언급했듯이 매우 벅찰 수 있습니다. 누군가가 HyperUI에 대해 그렇게 느끼기를 정말 원하지 않습니다. 그러니 참여해 주시고 모두 HyperUI가 더 나은 프로젝트가 되도록 밀어붙이도록 합시다.