status web

status-web

이 Monorepo에는 상태 생태계에 웹 응용 프로그램을 구축하기위한 패키지가 포함되어 있습니다. 이 패키지는 일관되고 아름다운 사용자 인터페이스를 만들기 위해 별도로 사용되거나 결합 될 수 있습니다.

패키지

이름	npm	설명
@status-im/components		Radix UI, React Aria, Tailwind CSS로 제작 된 구성 요소 라이브러리.
@status-im/js		Waku 프로토콜 통합 및 블록 체인 상호 작용을위한 Libary.
@status-im/icons		설계 시스템을 기반으로 자동 생성 된 아이콘 라이브러리.
@status-im/colors		설계 시스템을 기반으로 자동 생성 된 컬러 팔레트.
@status-im/eslint-config		프로젝트에서 일관된 코드 스타일을위한 ESLINT 구성을 공유했습니다.

앱

이름	설명
./apps/connector	상태 데스크톱 지갑은 브라우저의 분산 응용 프로그램으로 확장되었습니다.

전제 조건

필수의:

• node.js v20.x
• PNPM v9.12.x

권장 :

• 비주얼 스튜디오 코드
  • 최적의 개발 경험을 위해 .vscode/extensions.json 에 나열된 확장자를 설치하십시오

스택

• Turborepo : Monorepo를 관리하고 건물 속도를 높입니다
• TypeScript : 코드에 유형 안전을 추가합니다
• REACT : UI 건축을위한 메인 라이브러리
• Radix UI / React ARIA : 접근 가능한 UI 프리미티브 제공
• Tailwind CSS : 스타일링에 사용됩니다
• VITE : 빌드 도구 및 개발자 서버
• 스토리 북 : 구성 요소를 개발하고 보여주는 것
• Eslint : 코드를 일관성있게 유지하고 잠재적 인 문제를 포착합니다.
• 더 예쁘게 : 코드를 형식화합니다
• 변경 사항 : 버전 및 변경 사항을 관리합니다

시작하기

1. 저장소 복제 :

    git clone https://github.com/status-im/status-web.git
   cd status-web
   

2. 종속성 설치 :

    pnpm install
   

3. 모든 패키지 빌드 :

    pnpm build
   

4. 실행 테스트 :

    pnpm test
   

5. 개발 모드 시작 :

    pnpm dev
   

스토리 북

구성 요소를보고 상호 작용하려면 스토리 북을 실행할 수 있습니다.

 pnpm storybook

스토리 북 서버가 시작되어 구성 요소를 분리하고 테스트 할 수 있습니다.

스폰서

이 프로젝트는 Browserstack이 후원합니다.