reatom について
Reatom v1001の実装や解説を行う開発者向けのリファレンス型スキルです。付属のREFERENCE.mdをタスク別に案内し、コード規約と関連する専門スキルへの切り替え方を示します。
主な機能
- 01トピック別APIリファレンス案内
- 02既存コード規約への準拠
- 03Atomとcomputed値の既定
- 04非同期フローの指針
- 05フォームとルーティングのパターン
活用シーン
- 01Reatom v1001の機能を実装
- 02Reatomの基本概念を説明
- 03フォームやルーティングの方法を検索
- 04非同期コンテキスト境界に対応
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ reatom/ reatom --skill reatomインストール後、Claude Code で/reatomを入力して読み込まれたか確認します。
同梱ファイルREFERENCE.md
詳細
Reatom
Reatom v1001 を実装または説明する際は、このスキルを使用してください。このスキルに同梱されている正規の API リファレンスとして、REFERENCE.md を参照してください。
使い方
- タスクに該当する REFERENCE.md のセクションを読みます。リファレンスと矛盾する場合は、一般的な React/Solid/Vue の状態管理パターンを読み込まないでください。
- 対象のパッケージまたはサンプルにある既存コードに従い、命名、ファイル構成、拡張スタイルを合わせます。
- 深い非同期フロー(
wrap、withAsyncData、withAbort、サンプリング、Suspense)については、reatom-asyncスキルに切り替えてください。 @reatom/jsx(ネイティブ DOM JSX、mount、props、css prop)については、reatom-jsxスキルに切り替えてください。- プルリクエスト、レビュー、またはエージェントの出力の批判的な検証については、
reatom-reviewスキルに切り替えてください。 - ヘルパー、拡張機能、または公開 API の設計、改修、置き換えについては、
reatom-api-designスキルに切り替えてください。
セクション一覧
REFERENCE.md の関連する箇所だけを開くには、この一覧を使用してください。
| トピック | セクション |
|---|---|
| Atoms、computed、action、effect、extend | Core primitives and mental model |
| クエリとミューテーション | withAsync |
| await 後/コールバック内の非同期コンテキスト | wrap rules |
| コレクション、boolean、route ヘルパー | Primitives quick usage |
| ネストされたリアクティブフィールド | Atomization |
| Subscribe のエラーコールバック | Subscribe error listener |
| ログ、log.label、log.state | Full SPA example (logging setup) |
| フック、接続/切断、遅延処理 | Lifecycle and extension hooks |
| DOM/外部イベント | Event sampling and orchestration |
| ホットな導出値 | Memoization: memo and memoKey |
| フィールドとバリデーション | Forms: base usage and reactive validation |
| SPA ルートとローダー | Routing |
| 検索パラメーター、ストレージ | URL sync and persistence helpers |
| React Suspense との統合 | Suspense notes |
| バッチ更新 | Transactions notes |
| テストと SSR | SSR and testing |
| 古い Reatom からのアップグレード | v3 migration highlights |
より詳しいレシピとアダプターのドキュメントは、v1001.reatom.dev の /docs/handbook/* および /docs/reference/* にあります。
実装のデフォルト
- 名前付きの atoms、actions、computed values、effects を使用します。ファクトリー名には
reatom*プレフィックスを付けます。 - 読み取り:引数なしで呼び出します。書き込み:
.set(...)を使用します。 - 冪等な読み取り:
computed(async () => ...).extend(withAsyncData(...))。 - コマンド/ミューテーション:
action(async () => ...).extend(withAsync(...))。 - Reatom のフレームを抜ける非同期境界:
await wrap(promise)。外部コールバック:wrap(fn)を渡します。 - 派生状態には
computedを使用し、副作用には有効期間を明示したeffectを使用します(ルートローダー、初期化アクション、またはマウントスコープ。機能実装では、スコープのないモジュールレベルの effect は使用しません)。 - フォーム(フィールド、バリデーション、送信)には、フィールドごとの atom や送信アクションを独自に作成するのではなく、
reatomForm/reatomFieldを使用します。 - ルートデータには
reatomRouteローダーを使用し、ナビゲーションには.go(...)、リンクには.path(...)を使用します。
リファレンスとローカルのサンプルが食い違う場合は、リファレンスを優先し、サンプルが誤っていれば修正してください。
コメント
Markdown 対応