Open Source · Apache-2.0Lokal kostenlos · Teilen mit einem Befehl · Reviews gehen zurück an deinen Agenten

Erst zeigen, dann entscheiden, dann bauen

Schreib klickbare, abspielbare Prototypen in TS/TSX und vergleiche Varianten auf einem lokalen Board. Teile oder bette sie mit einem Befehl ein, lass dein Team im Review-Link abstimmen und entscheiden – und dein Agent passt den Quellcode mit joplo feedback an.

Konsole öffnenDoku lesen

Terminal

$ npx joplo@latest init my-demo$ npx joplo dev --open$ npx joplo share --review✓ Review-Version veröffentlicht → https://joplo.app/s/…$ npx joplo feedback2 Entscheidungen offen → an den Agenten übergeben
Das Joplo-Board spielt eine Demo ab: links die Varianten A und B, in der Mitte der Prototyp, unten die Schrittleiste.

So funktioniert's

Vom Quellcode zur Entscheidung – und zurück

Die Quelldateien sind maßgeblich, Git hält die Historie. Review-Feedback versandet nicht im Chat: Dein Agent schreibt die Entscheidungen zurück in dasselbe TSX, und du veröffentlichst erneut.

  1. 01

    TS/TSX schreiben

    Seiten, Varianten, Fälle und Abläufe stehen in Quelldateien, direkt neben deinem Code.

    options/a.tsx
  2. 02

    Auf dem Board vergleichen und abspielen

    Wechsle zwischen Variante A und B, sieh, welche Fälle jede abdeckt, und spiel die Demo Schritt für Schritt ab.

    npx joplo dev --open
  3. 03

    Teilen oder Review-Version veröffentlichen

    Ein normaler Link zeigt nur die gewählte Variante. Die Review-Version enthält alle Varianten; Regeln und Fragen sehen nur Reviewer.

    npx joplo share --review
  4. 04

    Reviewen, abstimmen, entscheiden

    Reviewer kommentieren neben der Demo, markieren Elemente und stimmen ab. Du wählst eine Variante, bestätigst oder verwirfst Regeln und beantwortest Fragen.

    cloud.joplo.app/review/…
  5. 05

    Dein Agent setzt die Entscheidungen um

    Der Agent holt sich offene Entscheidungen und Kommentare, ändert den Quellcode, führt check aus und markiert sie als umgesetzt.

    npx joplo feedback

Zurück zu Schritt 2: Sind die Änderungen drin, führ npx joplo share --review noch einmal aus. Mit Pro wird derselbe Review-Link aktualisiert, Kommentare und Stimmen bleiben erhalten.

Funktionen

Vom ersten Prototyp bis zur letzten Änderung des Agenten

01

Demo schreiben

Seiten, Varianten, Fälle und Abläufe sind TS/TSX in Git. Du und dein Agent bearbeitet dieselben Quelldateien.

  • Komponenten, Übergangskarten, mehrere Rollen und gestreamte Agent-Antworten
  • joplo check gibt pro Problem eine Zeile aus – leicht lesbar für Agenten
features/invite/options/a-modal.tsx
export default option({  name: 'A · Eine Person per E-Mail einladen',  tradeoffs: ['Kürzester Weg', 'Nur eine Einladung auf einmal'],});flow('Admin verschickt eine Einladung')  .click('btn_invite', 'Einladungsdialog öffnen')  .type('in_email', '[email protected]')  .select('sel_role', 'Bearbeiter', uses('role_cap'))  .click('btn_send', 'Einladung senden');

02

Varianten vergleichen

Schreib Variante A und B für dasselbe Feature. Das Board zeigt pro Fall, was jede Variante abdeckt – Lücken und offene Fragen fallen sofort auf.

  • Schritt für Schritt abspielen; Untertitel, Kamera und Ebenen folgen dem Ablauf
  • ⌥-Klick auf ein Element übergibt Datei und Zeile an deinen Agenten
Das Joplo-Board: links die Varianten A und B mit ihrer Abdeckung pro Fall, rechts der Prototyp.

03

Teilen und einbetten

npx joplo share veröffentlicht einen joplo.app/s/…-Link. Bette ihn in Blog, Doku oder README ein: Besucher sehen zuerst ein Cover und spielen dann ab oder wechseln in den Vollbildmodus.

  • Web-iframe, GitHub-Badge und Link-Karten – für jedes Konto
  • Kostenlose Links gelten 1 Stunde, Pro-Links laufen nie ab
Eine eingebettete Joplo-Demo läuft, mit Untertiteln und einer kompakten Steuerleiste für Einzelschritte und Vollbild.

04

Reviewen und an den Agenten zurückgeben

Schick einen Review-Link. Dein Team kommentiert neben der Demo, markiert Elemente und stimmt ab. Hast du entschieden, holt sich dein Agent die Entscheidungen mit npx joplo feedback und passt den Quellcode an.

  • Regeln und offene Fragen sind nur über den Review-Link sichtbar
  • Kommentieren und Abstimmen nur angemeldet; entscheiden kann nur der Autor
~/my-demo — zsh
$ 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: Nur erneutes Senden innerhalb 1 Minute sperrenUnresolved comments (1):  [c_7xw1] scenario invite.a-modal.success · step 2 — Chen      Button lieber „Teammitglieder einladen“ nennen?Next: update the source as decided, run npx joplo check,then npx joplo feedback --applied d_8f2k,d_3m9q

05Demnächst

CI und PR-Vorschauen

Veröffentliche aus der CI mit einem API-Schlüssel statt mit Geräte-Login. Sobald die Joplo GitHub App verfügbar ist, bekommt jeder PR einen Vorschau-Kommentar, und der Link läuft ab, wenn der PR geschlossen wird.

  • API-Schlüssel funktionieren schon jetzt: begrenzte Rechte, standardmäßig 90 Tage
  • PR-Vorschauen: 1 Stunde bei Free, bei Pro bis der PR geschlossen wird
.github/workflows/joplo-preview.yml
on: pull_requestjobs:  preview:    runs-on: ubuntu-latest    steps:      - uses: actions/checkout@v4      - run: npx joplo share --new --pr ${{ github.event.number }}        env:          JOPLO_API_KEY: ${{ secrets.JOPLO_API_KEY }}

Beispiele

Sieh dir an, was Joplo erklären kann

Von B2B-Admin-Oberflächen und Mobile-Apps bis zu Backend-Architektur und Fachartikeln. Jedes Beispiel läuft direkt hier – genau so, wie es eingebettet auf deiner eigenen Seite aussähe.

Alle Beispiele ansehen

Preise

Lokal kostenlos, Zusammenarbeit für alle

Erstellen, Prüfen und Bauen mit der CLI kostet nichts, und Einbettungen, Reviews und API-Schlüssel gibt es in jedem Konto. Mit Pro bezahlst du für dauerhafte Links und höhere Limits.

Free

0 $

Um es kurz jemandem zu zeigen oder eine Review-Runde zu starten.

  • Die komplette lokale CLI, Open Source und kostenlos
  • Nach der Anmeldung veröffentlichen; Links gelten 1 Stunde
  • Einbettungen: Web-iframe, GitHub-Badge, Link-Karten
  • Review-Links, Kommentare, Abstimmungen und joplo feedback
  • API-Schlüssel für CI und Skripte
  • PR-Vorschauen, 1 Stunde gültig (demnächst)
  • Freigabeseiten zeigen einen Free-Hinweis und die Joplo-Leiste
Kostenlos registrieren

Pro

Empfohlen

48 $/ Jahr

Wenn Links dauerhaft funktionieren sollen.

  • Freigabe-Links laufen nie ab
  • Kein Free-Hinweis und keine Markenleiste
  • Erneutes Veröffentlichen aktualisiert denselben Link, Review-Kommentare bleiben
  • Upgrade innerhalb von 7 Tagen nach Ablauf – der ursprüngliche Link kommt zurück
  • Höhere Upload- und Veröffentlichungslimits
  • PR-Vorschauen bis zum Schließen des PR (demnächst)
  • Private Links, Versionsverlauf und Cloud-Export (demnächst)
Auf Pro upgraden

Lifetime

99 $einmalig

Einmal zahlen und die Pro-Vorteile behalten.

  • Alles aus Pro
  • Keine Verlängerung
Lifetime kaufen

Preise in USD. Die Zahlungen wickelt Waffo Pancake als Merchant of Record ab.

FAQ

Häufige Fragen

Klare Antworten zu Preisen, Teilen, Einbettungen, Reviews und Agenten.

Zeig dein nächstes Feature zuerst als Demo

Lokal schreiben, abspielen und vergleichen. Das Echte baust du, wenn alles klar ist.

Terminal

$ npx joplo@latest init my-demo
Kostenlos registrierenDoku lesen