⚠️ Alpha Release - Early Access

This tool is in active development. You're using an Alpha version, which means:

Thank you for being an early adopter! Your participation helps us build a better tool for everyone.

Key Terms

Solid

An open web standard, created by Sir Tim Berners-Lee, that lets people and agents store their data in a personal store (a Pod) they control, rather than inside an app's database. Apps request access; you grant, deny, or revoke it. Full explainer →

Context Graph

A structured, continuously-updated record of how decisions get made — your agents' identity, memory, decisions, and audit trail, as linked data you own. Gartner (2026) calls context graphs "the new essential infrastructure for agentic systems." Solid is the open substrate; your context graph is what you build on it — open and portable, not locked in a vendor's platform. Learn more →

1. What You Need

Anthropic API Key (Required to Build Apps)

What: API key from Anthropic to access Claude AI

Why: The builder uses Claude to generate code from your prompts

How to get:

  1. Go to platform.claude.com
  2. Sign up or log in
  3. Navigate to API Keys section
  4. Create a new API key
  5. Copy the key (starts with "sk-ant-...")

Cost: You need credit in your Anthropic account

Where to add: Click the Settings icon (⚙️) in the header → paste your API key

Netlify Account (Optional - For One-Click Web Deployment)

What: A hosting account to deploy your apps to the web

Why: Pro subscribers can deploy with one click using their Netlify account

How to get:

  1. Go to netlify.com
  2. Sign up for a free account
  3. When you click "Deploy to Web" in Build, you'll be asked to authorise the connection — that's it

Cost: You can get started on their free tier

Alternative: Download ZIP and deploy manually (free tier option)

Stripe Subscription (Optional - For Pro Features)

2. Quick Start Guide

  1. Add Your Anthropic API Key
    • Click the Settings icon (⚙️) in the top-right header
    • Paste your Anthropic API key
    • Click "Save Settings"
  2. Write a Prompt
    • Scroll to the bottom chat area
    • Describe your app in plain English
    • Example: "Create a todo list with priority levels"
    • Example: "Build a contact manager with search"
    • Click "Build" (or press Enter)
  3. Review Generated Code
    • Left pane: See the generated React component code
    • Right pane: Live preview of your app
    • Continue the conversation: "Add a filter", "Change the styling", etc.
  4. Deploy or Download
    • Free Users: Click "Download ZIP" → Follow local dev instructions below
    • Pro Users: Click "Deploy to Web" → One-click Web deployment (requires Netlify account)

3. Understanding the Interface

Layout:
  • Top Header: Logo, Discord, Help, Settings icons
  • Left Pane: Code editor showing generated component
  • Right Pane: Live preview where your app runs
  • Bottom Area: Chat interface for prompts
  • Action Buttons: Download ZIP, Deploy to Web (Pro)

What the Preview Shows

4. Project Management

Your work is organized into projects. Each project contains your app code, conversation history, and version snapshots.

Saving Projects

Loading Projects

Export & Import (.interition files)

Project Settings (Pro)

Version History (Pro)

5. Deployment Options

Option A: One-Click Web Deployment (Pro Feature)

  1. Subscribe to Pro (Settings → Subscribe)
  2. Click "Deploy to Web"
  3. Connect your Netlify account (OAuth)
  4. Choose a site name
  5. Deploy - your app goes live in ~30 seconds
  6. Get a URL like: https://your-app-name.netlify.app

Option B: Download ZIP & Deploy Manually (Free)

  1. Click "Download ZIP"
  2. Extract the ZIP file
  3. Open terminal in the extracted folder
  4. Run these commands:
npm install          # Install dependencies
npm run build        # Build for production
npm start            # Run locally

To deploy to web:

Local Development (For Developers)

npm install
npm run dev          # Start development server
# Open http://localhost:3000

6. Subscription Features

Free Tier

No Subscription Required

  • ✅ Unlimited app generation (with your own API key)
  • ✅ Live preview and code editing
  • ✅ Download as ZIP
  • ✅ Full source code access
  • ❌ No project saving (session-based only)
  • ❌ No version history
  • ❌ No one-click deployment

Pro Tier (£249/month)

Everything in Free, plus:

  • ✅ One-click Web deployment (requires Netlify account)
  • ✅ Save unlimited projects (persistent across sessions)
  • ✅ Version history (last 10 snapshots per project)

Enterprise Tier

Custom Solutions

  • ✅ Managed Solid infrastructure
  • ✅ Dedicated support
  • ✅ SLA guarantees
  • ✅ Custom integrations
  • ✅ Volume licensing
  • ✅ Training & onboarding

Contact us for pricing and terms

Free Trial

How to Subscribe

  1. Click Settings (⚙️) in header
  2. Click "Subscribe to Pro"
  3. Complete Stripe checkout
  4. Pro features unlock immediately

How to Manage Subscription

Advanced Settings (Pro)

Pro users can fine-tune code generation in Settings:

7. Inrupt PodSpaces Setup

Generated apps use Inrupt PodSpaces for Solid authentication and data storage. Users of your app will need an Inrupt account with a provisioned Pod.

Problem: Login Succeeds but App Shows "Error fetching storage locations" (404)

Cause: The user's Inrupt account exists but their Pod or WebID profile hasn't been fully provisioned.

Solution: The app user needs to complete their Inrupt PodSpaces setup:

  1. Go to start.inrupt.com/profile
  2. Log in with their Inrupt credentials
  3. Complete any pending account setup steps
  4. Verify they can see their WebID and Pod storage location
  5. Return to your app and try logging in again

Useful Inrupt PodSpaces URLs

Understanding the Error

When a user authenticates, the app fetches their WebID document (e.g., https://id.inrupt.com/username) to find their Pod storage location. If this returns a 404 error, it means:

8. Staying Up to Date

Important: Interition is in alpha and changes frequently. Before troubleshooting issues, make sure you're running the latest version.

How to Refresh for the Latest Version

Your browser may cache the app, showing an older version. To ensure you have the latest:

Hard Refresh (Quick Method)

Full Cache Clear (If Hard Refresh Doesn't Work)

  1. Open browser settings
  2. Navigate to Privacy/History settings
  3. Clear cached images and files (you can keep cookies and passwords)
  4. Refresh the page

Checking Your Version

The current version is shown at the bottom of the Settings panel. Compare this with the latest release to confirm you're up to date.

Why This Matters

9. Troubleshooting

Data Management

These options are available in Settings under "Dangerous Actions":

Warning: Reset All App Data cannot be undone. Export your projects first if you want to keep them.

Problem: "Build" button doesn't work / nothing happens

Solution:
  1. Check you've added an Anthropic API key:
    • Settings → API Key field should be filled
    • Key should start with "sk-ant-"
  2. Check browser console for errors (F12 → Console tab)
  3. Verify your API key is valid:

Problem: Preview shows "Error: Failed to generate component"

Possible Causes:
  1. Invalid or expired API key → Update in Settings
  2. Anthropic API quota exceeded → Check your Anthropic billing
  3. Prompt was unclear → Try rephrasing more specifically
  4. Network issue → Check internet connection

Problem: Deployment fails

For One-Click Web Deployment:
  1. Verify you're subscribed to Pro (Settings → check subscription status)
  2. Check you've connected Netlify account (try disconnecting and reconnecting)
  3. Verify site name is available and valid:
    • Must be 3-63 characters
    • Lowercase letters, numbers, hyphens only
    • Cannot start/end with hyphen
  4. Check browser console for error details

Problem: Preview is blank or shows old code

Solutions:
  1. Hard refresh: Ctrl+Shift+R (Windows) or Cmd+Shift+R (Mac)
  2. Clear browser cache: Settings → Privacy → Clear browsing data
  3. Try a different browser (Chrome or Firefox recommended)

Problem: "Subscription required" message but I'm subscribed

Solutions:
  1. Refresh the page (sometimes subscription check needs refresh)
  2. Settings → Verify subscription shows as "Active"
  3. Check payment succeeded in Stripe (link in Settings → Manage Billing)
  4. Wait 1-2 minutes for webhook to process

Problem: Exported app shows "Invalid client_id" error with Inrupt PodSpaces

Symptom: When running an exported app locally or on deployment, you see an error message like: {"status":401,"title":"Unauthorized","detail":"Invalid client_id"...}

Cause: This occurs when your browser has cached authentication data from a previous Inrupt PodSpaces session that has expired or been invalidated.

Solutions:
  1. Quick fix: Open the app in an incognito/private browser window
  2. Permanent fix: Clear browser data for the app's domain:
    • Chrome/Edge: Click lock icon in address bar → Site settings → Clear data
    • Or: DevTools (F12) → Application → Clear site data
    • Clear: Cookies, Cache, and Local Storage
  3. After clearing, hard refresh the page: Ctrl+Shift+R (Windows) or Cmd+Shift+R (Mac)

Prevention: This issue only affects development/testing. Deployed apps on unique domains won't have stale session data.

Problem: "403 Forbidden" error when logging in to Inrupt PodSpaces

Symptom: When trying to log in with Inrupt PodSpaces, you see an error like: 
{
  "status": 403,
  "title": "Forbidden",
  "instance": "/callback",
  "error": "invalid_request"
}

Cause: Your browser has stored old Solid authentication data that has become invalid or expired. This can happen after failed login attempts or when authentication tokens expire.

Solution: Clear the Solid login data from your browser. Follow the steps for your browser below:

For Google Chrome:

  1. Open the app in Chrome (the page where you're getting the error)
  2. Press F12 on your keyboard (or right-click anywhere and select "Inspect")
  3. A panel will open - click the Application tab at the top
    • If you don't see it, click the >> arrows to find it
  4. In the left sidebar, click Local Storage, then click on the website address below it
  5. Look for any rows that start with solidClientAuthenticationUser
  6. Click on each one and press the Delete key, or right-click and select "Delete"
  7. Close the panel (click the X or press F12 again)
  8. Refresh the page and try logging in again

For Firefox:

  1. Open the app in Firefox (the page where you're getting the error)
  2. Press F12 on your keyboard (or right-click anywhere and select "Inspect")
  3. A panel will open - click the Storage tab at the top
  4. In the left sidebar, click Local Storage, then click on the website address below it
  5. Look for any rows that start with solidClientAuthenticationUser
  6. Right-click on each one and select "Delete"
  7. Close the panel (click the X or press F12 again)
  8. Refresh the page and try logging in again

For Safari (Mac):

  1. First enable developer tools: Safari menu → Settings → Advanced → Show Develop menu
  2. Open the app in Safari
  3. Press Option + Command + I (or Develop menu → Show Web Inspector)
  4. Click the Storage tab
  5. Click Local Storage in the sidebar
  6. Find and delete any rows starting with solidClientAuthenticationUser
  7. Close the inspector and refresh the page

Quick Alternative: Try opening the app in an incognito/private browser window - this starts with a clean slate and often resolves the issue immediately.

Still not working? Try using a different browser (Firefox often works when Chrome doesn't, or vice versa).

Still Having Issues?

Contact Us:

When reporting issues, please include:

  • What you were trying to do
  • Error message (screenshot helps)
  • Browser and OS version