Editing Your App
Visual editor, code view, and chat-based edits.
Editing options at a glance
After generation, click Edit to open the editor. AppCafe supports three main editing styles:
- visual editing for direct page changes
- chat editing for natural-language requests
- code view for precise source-level adjustments
Visual editor
Use the visual editor when you want to work directly on the page.
Typical actions include:
- selecting a section, button, image, or text block
- editing text inline
- replacing or regenerating images
- updating colors, spacing, alignment, or layout settings
- reviewing the result immediately in the live preview
Visual editing is the fastest option for most content and layout changes.
Chat-based editing
Open the chat panel inside the editor when you want to describe a change in plain English. Good requests are specific and scoped.
Examples:
- "Make the hero section feel more premium and reduce the amount of text."
- "Add a testimonials section below the features grid."
- "Turn the call to action button into a high-contrast primary button."
Chat editing is best when you know the outcome you want but do not want to manually adjust every element yourself.
Code view
Switch to code view when you need exact control over the source. This is useful for advanced edits, precise markup changes, or reviewing how a page is built.
Use code view when:
- a visual control is not available for the change you want
- you need to inspect a component-level detail
- you are comfortable reading or adjusting JSX directly
How to choose the right editing mode
Use this rule of thumb:
- Visual editor: best for styling, text, spacing, and media changes
- Chat editing: best for structural or descriptive requests
- Code view: best for exact implementation-level adjustments
Safe editing tips
- Make one clear change at a time.
- Review the preview after each significant update.
- Prefer specific requests over vague ones like "make it better."
- If a page is structurally wrong, consider regeneration before doing many manual edits.
Undo, redo, and recovery
AppCafe keeps changes versioned. Use Ctrl+Z or Cmd+Z for quick undo, and use version history when you need to roll back to an earlier state.
That means you can experiment without feeling like one click will ruin the project forever.