status web

status-web

このモノレポには、ステータスエコシステムにWebアプリケーションを構築するためのパッケージが含まれています。これらのパッケージは、一貫した美しいユーザーインターフェイスを作成するために個別に使用するか、組み合わせて使用できます。

パッケージ

名前	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 ：モノレポを管理し、ビルドをスピードアップします
• タイプスクリプト：コードにタイプの安全性を追加します
• React ：UIを構築するためのメインライブラリ
• RADIX UI / ReactAria ：アクセス可能なUIプリミティブを提供します
• Tailwind CSS ：スタイリングに使用
• Vite ：ビルドツールとDEVサーバー
• ストーリーブック：コンポーネントの開発と紹介用
• 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が後援しています。