Zum Inhalt springen
WebViewGold Vibe Coding in den App Store
Deutsch
WebViewGold holen

Kiro

Spec-Driven Development mit Kiro: eine Readiness-Spec für die native App deiner Web-App schreiben

Kiro macht aus einem Prompt eine Spec: Anforderungen mit testbaren Akzeptanzkriterien, ein Design und eine Aufgabenliste, die der Agent dann abarbeitet. Store-Readiness passt gut in diese Form, denn Apple und Google veröffentlichen konkrete Regeln, aus denen du Akzeptanzkriterien machen kannst. Unten findest du eine Steering-Datei für den WebView-Kontext, eine Anforderungsdatei zur nativen App-Readiness zum Einfügen und wie du die Spec ausführst, ohne die Kontrolle zu verlieren.

Ab $109 einmalig pro Plattform, oder unser Team erledigt alles ab $698.

  • Genehmigungsgarantie – oder Geld zurück innerhalb von 14 Tagen
  • Kein Programmieren nötig
  • Einmalzahlung, kostenlose Updates
  • 24/7 Support von echten Menschen
  • Made in Germany seit 2014 · ISO 27001

Wie Specs und Steering in Kiro funktionieren

Kiro, die spec-getriebene agentische IDE von AWS (auch als CLI und im Web verfügbar), arbeitet in zwei Ebenen. Specs liegen in .kiro/specs/<spec-name>/ und bestehen aus drei Dateien: requirements.md mit User Stories und Akzeptanzkriterien in EARS-Notation ("WHEN [condition] THE SYSTEM SHALL [behavior]"), design.md mit Architektur, Sequenzdiagrammen, Fehlerbehandlung und Teststrategie sowie tasks.md, einer Liste einzelner, nachverfolgbarer Umsetzungsaufgaben. Bugfixes nutzen eine Bugfix-Spec mit bugfix.md statt der Anforderungen. Du kannst Aufgaben einzeln oder alle auf einmal ausführen; dann baut Kiro einen Abhängigkeitsgraphen und führt unabhängige Aufgaben in parallelen "Wellen" aus.

Steering-Dateien geben Kiro dauerhaftes Wissen über das Projekt. Sie liegen in .kiro/steering/ (oder global in ~/.kiro/steering/; bei Konflikten gewinnen die Workspace-Regeln). Kiro kann product.md, tech.md und structure.md für dich erzeugen und liest außerdem AGENTS.md. Jede Steering-Datei wählt in ihrem Frontmatter einen Inclusion-Modus: always, fileMatch, manual oder auto (Steering-Dokumentation).

Für die Store-Readiness ist diese Aufteilung genau richtig. Steering trägt die dauerhaften Fakten (die App läuft in einer WebView, diese Regeln gelten immer); die Spec trägt das einmalige Projekt, die App durchs Review zu bringen. Die Spec-Dateien sind reines Markdown, sie funktionieren also auch als Briefing für Claude Code oder Codex, falls du später den Agenten wechselst; die Übersicht der KI-Coding-Agenten vergleicht die Optionen.

Steering-Datei: .kiro/steering/native-app.md

Das Frontmatter muss ganz am Anfang der Datei stehen. #[[file:...]] holt eine andere Datei in den Kontext; lass diese Zeile weg, wenn du noch keine Review-Notizen hast. Für Regeln, die nur beim Bearbeiten der nativen Projekte zählen, legst du eine zweite Datei mit inclusion: fileMatch und einem fileMatchPattern für ios/** und android/** an.

markdown
---
inclusion: always
---

# Native app context (WebViewGold)

This web app is published as iOS and Android apps built with WebViewGold.
The apps load https://app.example.com in a WKWebView (iOS) / Android WebView,
so every deploy is live in both apps without a store update.

- Detect the app with isNativeApp(): navigator.userAgent contains "WebViewGoldApp"
  (set via useragent_iphone / useragent_ipad in Config.swift, USER_AGENT in Config.java).
- Native features are URL schemes handled by the wrapper. Use only schemes listed in
  https://www.webviewgold.com/llms-full.txt and always keep a browser fallback.
- No window.open popups for sign-in or payment inside the app.
- Store rules: Apple 4.2 (more than a website), 4.8 (Sign in with Apple next to other
  social logins), 5.1.1 (privacy policy, in-app account deletion), 3.1.1 (digital
  goods use in-app purchase on iOS). Google Play: account deletion + Data safety.
- Never edit signing, provisioning, keystores or the purchase code in ios/ or android/.

#[[file:docs/store-review-notes.md]]

requirements.md: Readiness der nativen App

Lege eine Feature-Spec mit dem Requirements-First-Workflow an (Kiro-Panel, der +-Button unter Specs, oder wähle Spec im Chat) und ersetze die erzeugte Datei durch diese, angepasst an deine Routen. Führe dann Analyze Requirements aus, um Lücken und Widersprüche zu finden, bevor das Design beginnt.

markdown
# Requirements: Native app readiness

## Introduction
Prepare the web app for publication as iOS and Android apps built with WebViewGold,
so that it can pass App Store and Google Play review on the first submission.

## Requirement 1: Mobile layout
**User story:** As a phone user, I want every screen to fit and respond to touch.
1. WHEN any route renders at a viewport width of 320 px THE SYSTEM SHALL show no horizontal scrolling.
2. WHEN a fixed header or tab bar renders THE SYSTEM SHALL pad it with env(safe-area-inset-top) or env(safe-area-inset-bottom).
3. WHEN an interactive element renders THE SYSTEM SHALL give it a touch target of at least 44 x 44 px.

## Requirement 2: Account deletion
**User story:** As a user, I want to delete my account inside the app.
1. WHEN a signed-in user opens Settings THE SYSTEM SHALL show a Delete account action.
2. WHEN the user confirms deletion THE SYSTEM SHALL delete their data and auth record server-side, sign them out and show a confirmation.
3. WHEN anyone opens /delete-account THE SYSTEM SHALL explain how to delete an account in the app and by email.

## Requirement 3: Sign-in
**User story:** As a user, I want to sign in the way I prefer without leaving the app.
1. WHEN the sign-in screen offers Google or another third-party login THE SYSTEM SHALL offer Sign in with Apple as an equivalent option.
2. WHEN sign-in runs inside the native app THE SYSTEM SHALL complete without opening a popup window.

## Requirement 4: Legal pages
**User story:** As a reviewer, I want to find the privacy policy and terms quickly.
1. WHEN /privacy or /terms is requested directly THE SYSTEM SHALL return the page with HTTP 200.
2. WHEN the user opens Settings THE SYSTEM SHALL link to both pages.

## Requirement 5: Resilience
**User story:** As a user on a weak connection, I never want to see a blank screen.
1. WHEN a data request fails THE SYSTEM SHALL show an error message with a retry action.
2. WHEN a list has no items THE SYSTEM SHALL show an empty state.

## Requirement 6: App-only presentation
**User story:** As an app user, I do not want to be told to download the app I am using.
1. WHEN the user agent contains WebViewGoldApp THE SYSTEM SHALL hide download-our-app banners, builder badges and links to store listings.
2. WHEN the user agent does not contain WebViewGoldApp THE SYSTEM SHALL keep the website unchanged.

## Requirement 7: Native value
**User story:** As a returning user, I want to be notified about things that matter to me.
1. WHEN a signed-in user finishes onboarding in the iOS app THE SYSTEM SHALL offer an Enable notifications button that calls registerpush://.
2. WHEN the app exposes a push subscription ID (onesignalplayerid) THE SYSTEM SHALL store it on the user profile.

## Requirement 8: Secrets
**User story:** As the owner, I want no secret key to reach a device.
1. WHEN the production bundle is built THE SYSTEM SHALL contain only publishable keys.

Mein iOS WebView wurde endlich genehmigt. Danke!!

Taha Farooqui · CodeCanyon

Prompt zum Erzeugen von Design und Tasks

Nutze ihn, nachdem du requirements.md geprüft hast. Er zwingt Kiro, das Design auf deinen echten Code zu stützen und die Aufgaben klein genug für ein Review zu halten.

In den Kiro-Chat einfügen, während die Spec offen ist
Lies .kiro/steering/ und AGENTS.md, dann die Anforderungen der Spec native-app-readiness. Untersuche die Codebasis, bevor du etwas schreibst: Stütze jede Designentscheidung auf die Routen, Auth-Provider, Datenbank und das Hosting, die dieses Projekt tatsächlich nutzt, und liste alles auf, was eine Anforderung voraussetzt, du aber nicht finden konntest.

Design: Beschreibe das Utility isNativeApp() und wo es verwendet wird, wo die Logik zur Kontolöschung auf dem Server läuft und wie sie den Aufrufer authentifiziert, wie die Push-Subscription-ID ins Nutzerprofil gelangt, die gemeinsame Komponente für Lade-, Leer- und Fehlerzustände und wie Sign in with Apple in das bestehende Auth-Setup passt. Ergänze ein Sequenzdiagramm für die Kontolöschung. Nichts im Design darf einen Secret Key in den Client-Code verlagern.

Tasks: eine Aufgabe pro prüfbarer Änderung, jeweils mit Verweis auf die Nummern der Anforderungen und mit einem manuellen Testschritt bei 375 px Breite am Ende. Mach die erste Aufgabe zu einer reinen Zahlungsinventur (wo digitale Güter oder Abos verkauft werden), ohne Codeänderungen. Lege keine Aufgaben an, die Signierung, Provisioning, Keystores oder den Bundle Identifier in ios/ oder android/ betreffen.

Halte nach design.md an und warte auf mein Review, bevor du tasks.md schreibst.

Die Spec ausführen, ohne die Kontrolle zu verlieren

Eine Spec ist nur so gut wie die Review-Schritte, die du beibehältst.

  1. Zuerst das Steering schreiben

    Erzeuge die Grundlagendateien (product, tech, structure) und ergänze dann die native-app-Steering-Datei von oben. Ohne sie entwirft Kiro für einen Desktop-Browser.

  2. Die Spec anlegen und die Anforderungen prüfen

    Nimm eine Feature-Spec mit dem Requirements-First-Workflow, nicht Quick Spec: Quick Spec schreibt Anforderungen, Design und Tasks in einem Durchgang ohne Freigabeschritte. Kommentiere konkrete Passagen mit Markdown Review und führe Analyze Requirements aus.

  3. Das Design prüfen, wie ein Reviewer es täte

    Prüfe drei Dinge: Die Löschung passiert auf dem Server und entfernt den Auth-Nutzer, in keinem Anmeldeweg innerhalb der App erscheint ein Popup, und kein Secret Key wandert in den Client. Alles andere ist Geschmackssache.

  4. Die ersten Aufgaben einzeln ausführen

    Eine gute Aufgabe liest sich wie - [ ] 4. Add server-side account deletion (Requirements 2.2). Führe sie einzeln aus, bis die Layout- und Auth-Aufgaben gemergt sind; parallele Wellen, die dieselben Komponenten bearbeiten, erzeugen Konflikte, die du dann doppelt prüfst.

  5. Deployen und in der App testen

    Deploye die Web-App und öffne sie dann in einem WebViewGold-Test-Build. Die Anforderungen 3.2, 6 und 7 lassen sich nur dort überprüfen.

  6. WebViewGold konfigurieren

    Setze URL, User-Agent-Token und Push-Schalter in Config.swift und Config.java. Kiro kann sie bearbeiten, wenn die fileMatch-Steering-Datei ihm sagt, nur Werte zu ändern; die Signierung bleibt bei dir.

Von der Spec-Anforderung zur Store-Regel

AnforderungAppleGoogle Play
1. Mobiles Layout4.0 DesignFehlerhafte Funktionalität
2. Kontolöschung5.1.1(v)Anforderung zur Kontolöschung
3. Anmeldung4.8 Login-DiensteAuf Android nicht vorgeschrieben
4. Rechtsseiten5.1.1 DatenschutzRichtlinie zu Nutzerdaten, Link zur Datenschutzerklärung
5. Robustheit2.1 App-VollständigkeitFehlerhafte Funktionalität
6 und 7. UI nur für die App und nativer Mehrwert4.2 MindestfunktionalitätMinimum Functionality / WebView-Spam

Stolperfallen

  • Anforderungen, die aus dem Prompt statt aus dem Code entstehen. Kiro spezifiziert gern eine Route /settings, die du gar nicht hast. Bitte es, aufzulisten, was es nicht finden konnte.
  • Quick Spec für dieses Projekt nutzen. Geschwindigkeit ist hier nicht der Engpass; die Freigabeschritte sind der eigentliche Sinn.
  • "Run all tasks" auf einer frischen Spec. Wellen führen unabhängige Aufgaben gleichzeitig aus, aber "unabhängig" wird anhand der Aufgabenliste beurteilt, nicht danach, welche Dateien sich wirklich ändern.
  • Spec-Drift. Wenn du deine Meinung änderst (zum Beispiel Google-Login per Redirect statt per Popup), aktualisiere zuerst requirements.md und lass Kiro dann Design und Tasks anpassen.
  • Akzeptanzkriterien als Beweis behandeln. Kiro kann Code prüfen; wie ein Apple-Reviewer deine App erlebt, sieht es nicht. Teste den Build auf einem Handy.
  • Zahlungen, die stillschweigend "repariert" werden. Halte die Zahlungsinventur rein berichtend, bis du den Guide Stripe vs. In-App-Kauf gelesen hast.

Checkliste vor der Einreichung

  • Jede Aufgabe in tasks.md ist abgehakt oder bewusst gestrichen, und requirements.md beschreibt noch, was gebaut wurde.
  • Die URL /delete-account ist in der Play Console eingetragen, die URL der Datenschutzerklärung in beiden Konsolen.
  • Sign in with Apple und die Kontolöschung wurden in einem echten Build getestet, nicht nur im Browser.
  • Supabase- oder Firebase-Backends bestehen die Supabase-Checkliste oder die Firebase-Checkliste.
  • Der kostenlose Readiness-Check meldet für deine Produktions-URL keine Probleme.

Häufig gestellte Fragen

Wo liegen die Spec-Dateien von Kiro, und sollte ich sie committen?

In .kiro/specs/, ein Ordner pro Spec, mit requirements.md, design.md und tasks.md. Committe sie; sie dokumentieren, warum sich die App so verhält, wie die Reviewer sie gesehen haben, und helfen dem nächsten Agenten oder Entwickler.

Funktioniert das in der Kiro CLI oder nur in der IDE?

Specs und die Ausführung von Aufgaben gibt es in der IDE, in der CLI und im Web. Analyze Requirements ist für IDE und CLI aufgeführt, Property-based Correctness Testing nur für die IDE; mach das Review der Anforderungen also in einer der beiden.

Was ist die EARS-Notation?

Der Easy Approach to Requirements Syntax. Jedes Kriterium nennt einen Auslöser und ein erwartetes Verhalten (WHEN etwas passiert THE SYSTEM SHALL etwas tun). Das macht es testbar, und ein Agent kann daraus leicht Code und Prüfungen ableiten.

Liest Kiro AGENTS.md?

Ja. Kiro liest AGENTS.md im Workspace-Root, in Unterverzeichnissen und im globalen Steering-Ordner. Diese Dateien werden immer einbezogen und unterstützen keine Inclusion-Modi, halte sie also kurz und lege bedingte Regeln in Steering-Dateien ab.

Sollte die Spec auch die Xcode- und Android-Projekte von WebViewGold abdecken?

Halte die Spec bei der Web-App. Die native Seite besteht aus einer Handvoll Konfigurationswerten, nicht aus einem Feature; eine kurze Checkliste und eine geprüfte Bearbeitung von Config.swift und Config.java reichen.

Drei Wege, deine App in die Stores zu bringen

Gleiches Ergebnis, unterschiedlich viel Arbeit auf deiner Seite. Alle drei kommen mit Genehmigungsgarantie und 24/7 Support von echten Menschen.

Selbst machen

$109 pro Plattform, einmalig

Die WebViewGold-Lizenz: ein fertiges Xcode- oder Android-Studio-Projekt. URL einfügen, Name und Icon setzen, Features einschalten, bauen und einreichen. Kostenlose Updates für immer.

Pakete auf der Hauptseite ansehen

Full Service

$698 pro Plattform $798

Schick uns deine URL und dein Icon. Unser Team konfiguriert, baut und liefert deine App innerhalb von 72 Stunden, White-Label, inklusive Quellprojekten. Beide Plattformen für $1,158.

Full-Service-Details Powered by WeSetupYourWebViewApp

Winter-Sale-Preise gültig bis 31. Dezember 2026.

Bereit, deine App zu veröffentlichen?

App Store & Google Play Genehmigungsgarantie – oder Geld zurück innerhalb von 14 Tagen

Lieber abgeben? Full Service: Wir konfigurieren, bauen und liefern innerhalb von 72 Stunden, ab $698 pro Plattform. Fragen? Chatte mit uns – 24/7.

Erstattungen erfolgen zu den in unseren FAQ genannten Bedingungen: eine nicht inhaltsbedingte Ablehnung durch Apple und/oder Google, geltend gemacht innerhalb von 14 Tagen nach dem Kauf.