0xMiden / 0xMiden/tutorials

Add React SDK TypeScript Client tutorial for account state and balances

未关闭
#198 0 条评论 0 个 reaction 已指派 1 人 已被 @BrianSeong99 认领 在 GitHub 查看
主要语言
Rust
星标
18
派生
34
PR 合并指标
30 天内没有已合并 PR

描述

## Problem

Pioneer feedback called out that there is no obvious, working React SDK example for common app flows such as fetching the connected wallet account and rendering balances.

These examples should be runnable from this repository and then surfaced in the docs site through the tutorial ingestion flow.

## Decision

Use `0xMiden/tutorials` as the source of truth for runnable React SDK / TypeScript Client tutorials. The docs repo should link to or ingest these pages, while keeping API/reference material in the docs repo.

Also prefer the user-facing label "TypeScript Client" over "Web Client" for the tutorial/recipe section, while keeping browser/WASM-specific caveats in the content.

## Proposed scope

- Add a runnable React SDK tutorial for account state and balances.
- Cover provider setup, client readiness, connected/active account selection, sync before reads, balance rendering, loading/error/empty states, and refresh after transactions.
- Include a minimal working UI in `web-client/` that can be exercised locally.
- Update the source tutorial docs under `docs/src/web-client` or perform a careful rename to `docs/src/typescript-client` if the docs ingestion path is updated at the same time.
- Link back to the React SDK reference docs in `0xMiden/docs`.
- Include `useExecuteProgram()` only if it is available in the current shipped React SDK and can be validated.

## Acceptance criteria

- A developer can run the tutorial from a clean checkout and see the account/balance flow working.
- The tutorial includes copy-pasteable React SDK code using the current `@miden-sdk/react` package API.
- The docs source clearly distinguishes React hooks from lower-level TypeScript/WebClient APIs.
- The example is validated in a clean Docker environment; use Playwright for the browser flow where practical.
- The tutorial is ready to be ingested into the main docs site.

## Related

- 0xMiden/docs#275

贡献指南

打开贡献指南

调研方向

The tutorial will be added to the `docs/src/web-client` or `docs/src/typescript-client` directory. Start by examining the existing tutorial structure in the repository. Create a runnable React example in the `web-client/` folder, ensuring it uses the `@miden-sdk/react` package. Validate the flow with Playwright tests. The tutorial should cover provider setup, account selection, balance fetching, and UI states. Link to the main docs for API details.

由索引模型根据 Issue 内容生成。

评估

技术栈
react, typescript
领域
documentation, web-dev
Issue 类型
文档
难度
3/5
预计耗时
1-2 天
活跃度
冷清
描述清晰度
描述清楚
新手友好度
65/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。