Skip to main content
Before performing any complex frontend task, Kombai always generates an editable plan for you to approve or update. This ensures that the task and generated code is always in your control. Complexity of a task is determined by the number of sections, images, icons, global store entities, queries, etc. required in the code.

​
Plan files structure

  1. Sections: List of all the sections present in the design or input instructions.
  2. Features: List of all the features that will be generated based on your input.
  3. Editable plan files: Kombai provides the following editable files with each plan: schema.ts, endpoints.ts, rootProps.ts, theme.ts, and enums.ts.
  4. Style Guide: It lets you define the colors, appearance, typography, and animation for the code. Style guide is currently generated only for landing pages.
For static websites and landing pages, Kombai generates a Style Guide. For web apps, Kombai generates Editable Plan Files.

​
Editable plan.md

For common tasks that don’t require creating a new component or page (such as modifying an existing code file), only the Editable plan files section with a plan.md file will be generated.

​
Approve the plan

Once the plan is generated, click the Approve Plan & Start Coding button to accept the plan and start the code generation process.

​
Update the plan

Once the plan is generated, you can edit the generated plan files or ask Kombai to make changes to the plan.
  • Through files edit
  • Through follow-up
  1. Click the icon at the top right corner of a plan section. This will open the section in a new tab.
  2. Modify the plan and save the file. You will now see the modified tag on that plan section.
  3. Click the Update Plan button at the bottom of the plan to start the code generation process.

​
How to toggle plan

  1. Click the Quick Settings icon in Kombai’s input box.
  2. Switch the Plan before complex tasks setting on or off.
⌘I