オープンソース · Apache-2.0ローカルは無料 · コマンド 1 つで共有 · レビュー結果は Agent へ
TS/TSX でクリック・再生できるプロトタイプを書き、ローカルのボードで案を比べる。コマンド 1 つで共有・埋め込みし、チームはレビューリンクで投票して決定。Agent は joplo feedback で決定どおりにソースを直します。
ターミナル
$ npx joplo@latest init my-demo$ npx joplo dev --open$ npx joplo share --review✓ レビュー版を公開 → https://joplo.app/s/…$ npx joplo feedback未反映の決定 2 件 → Agent に渡す
使い方
ソースファイルが正であり、履歴は Git が持ちます。レビューの意見はチャットに埋もれません。決まった内容を Agent が同じ TSX に書き戻し、もう一度公開します。
画面、案、ケース、フローをすべてソースファイルに書き、コードと一緒に置きます。
options/a.tsx案 A / B を切り替え、それぞれがどのケースをカバーしているかを見ながら、ステップごとに再生します。
npx joplo dev --open通常のリンクは選んだ案だけ。レビュー版はすべての案を含み、ルールや論点はレビュアーにしか見えません。
npx joplo share --reviewレビュアーはデモの横でコメントし、要素を指し、投票します。作者は案を選び、ルールを確定・却下し、質問に答えます。
cloud.joplo.app/review/…Agent は未反映の決定とコメントを取得し、ソースを直して check を通し、反映済みにします。
npx joplo feedbackステップ 2 に戻る：直し終えたら npx joplo share --review をもう一度。Pro なら同じレビューリンクが更新され、コメントと投票もそのまま残ります。
機能
01
画面、案、ケース、フローを TS/TSX で書いて Git に入れます。あなたも Agent も同じソースを編集します。
export default option({name: 'A · メールで 1 人ずつ招待するダイアログ',tradeoffs: ['最短の手順', '一度に 1 人だけ'],});flow('管理者が招待を送る').click('btn_invite', '招待ダイアログを開く').type('in_email', '[email protected]').select('sel_role', '編集者', uses('role_cap')).click('btn_send', '招待を送信');
02
同じ機能に案 A と B を書きます。ボードはケースごとに各案のカバー状況を並べるので、抜けや未決の点がひと目でわかります。
03
npx joplo share で joplo.app/s/… のリンクとして公開。ブログやドキュメント、README に埋め込めば、訪問者はまずカバーを見て、クリックで再生・全画面表示できます。
04
レビューリンクを送ると、同僚がデモの横でコメントし、要素を指し、投票します。あなたが決めたら、Agent は npx joplo feedback で決定を受け取り、そのとおりにソースを直します。
$ npx joplo feedbackShare k3f9x2Qa1B · version 3Decisions not yet applied (2):[d_8f2k] Pick option invite.a-modal for feature invite[d_3m9q] Reject rule resend_cap: 1 分以内の再送だけ止めるUnresolved comments (1):[c_7xw1] scenario invite.a-modal.success · step 2 — 陳晨ボタンの文言を「同僚を招待」にしては？Next: update the source as decided, run npx joplo check,then npx joplo feedback --applied d_8f2k,d_3m9q
05近日公開
CI では API キーで公開でき、デバイスログインは不要です。Joplo GitHub App の提供が始まれば、PR ごとにプレビューのコメントが付き、PR を閉じるとリンクが失効します。
on: pull_requestjobs:preview:runs-on: ubuntu-lateststeps:- uses: actions/checkout@v4- run: npx joplo share --new --pr ${{ github.event.number }}env:JOPLO_API_KEY: ${{ secrets.JOPLO_API_KEY }}
サンプル
B2B の管理画面からモバイルアプリ、バックエンドの構成や技術記事まで。ここでそのまま再生でき、自分のページに埋め込んだときと同じ見た目です。
B2B SaaSチーム招待管理者がメンバーを招待し、権限を選びます。送信成功、失敗からの再試行、招待権限のないメンバーの 3 つの流れをステップごとに再生できます。対象：管理画面系プロダクトの PM・デザイナー3 シーン
コンシューマー向けアプリ · 2 人キャンプアシスタントシャオユーがアシスタントに週末キャンプを計画してもらい、友人のアジエに共有します。天気や人数が変わると、アシスタントが自分から計画を組み直します。対象：モバイルアプリや AI アシスタントを作るチーム
技術解説頭脳と手を分けた Agent のバックエンド1 回の Agent タスクを、クライアントからクラウドまで通しで追います。頭脳はツール呼び出しを出すだけで、実行は端末側のエグゼキューターとクラウドのサンドボックスが担います。対象：チームにアーキテクチャを説明するエンジニア
技術解説 · ブログ連動Intelligent UI の実装AI に画面を直接出力させる 2 つのアプローチと、モデルからサンドボックスまでの全体の流れ。ブログ記事と合わせてどうぞ。対象：技術記事を書く人、登壇する人4 シーン料金
CLI での作成・チェック・ビルドは無料。埋め込み、レビュー、API キーはすべてのアカウントで使えます。Pro で買えるのは無期限のリンクと、より大きな上限です。
$0
同僚にちょっと見せたい、レビューを一度回したいときに。
$48/ 年
リンクをずっと使いたいときに。
価格は米ドル表示です。決済は Waffo Pancake が販売代理店（Merchant of Record）として処理します。
FAQ
料金、共有、埋め込み、レビュー、Agent についての率直な回答です。