ICMS Builder Docs

What is ICMS Builder?

ICMS Builder is a powerful, flexible content management system that provides three core engines to help you build dynamic web applications quickly and efficiently.

Form Engine

Create dynamic forms with validation, conditional logic, and custom field types.

Learn More

Action Engine

Build automated workflows and integrate with external APIs seamlessly.

Learn More

Component Engine

Design reusable UI components with custom styling and behavior.

Learn More

Core Engines Overview

ICMS Builder consists of three powerful engines that work together to create dynamic applications:

Form Engine

Create sophisticated forms with validation, components, and actions.

Dynamic form generation
Comprehensive validation schemas
Reusable form controls
Action integration

Action Engine

Build automated workflows and handle business logic.

Event-driven workflows
API integrations
Custom actions
Process automation

Component Engine

Design reusable UI components with custom styling.

Component library
Custom styling system
Theme support
Responsive design

End-to-End Flow Examples

See how the three engines work together in real-world scenarios. These examples demonstrate the complete flow from form creation to action execution and component rendering.

Basic Contact Form Flow

A simple contact form that demonstrates the basic end-to-end flow:

Form Definition

                                                {
  "type": "form",
  "validatorSchema": {
    "name": { "type": "string", "required": true },
    "email": { "type": "string", "format": "email" },
    "message": { "type": "string", "minLength": 10 }
  },
  "components": [
    { "type": "text", "name": "name", "label": "Name" },
    { "type": "email", "name": "email", "label": "Email" },
    { "type": "textarea", "name": "message", "label": "Message" },
    { "type": "button", "btnType": "submit", "text": "Send" }
  ]
}
                                            

Action Integration

                                                {
  "onSubmit": {
    "method": "POST",
    "action": "/api/contact",
    "target": "_self"
  }
}
                                            

Component Rendering

The Component Engine renders the form with proper styling and validation feedback.

Advanced User Registration Flow

A complex registration form with conditional fields and multi-step validation:

Complex Schema

                                                {
  "validatorSchema": {
    "userType": { "type": "string", "enum": ["individual", "business"] },
    "personalInfo": {
      "type": "object",
      "properties": {
        "firstName": { "type": "string", "required": true },
        "lastName": { "type": "string", "required": true },
        "email": { "type": "string", "format": "email" }
      }
    },
    "businessInfo": {
      "type": "object",
      "conditional": "userType === 'business'",
      "properties": {
        "companyName": { "type": "string" },
        "taxId": { "type": "string", "pattern": "^[0-9]{9}$" }
      }
    }
  }
}
                                            

Conditional Logic

The Action Engine handles conditional field display and validation based on user selections.

Multi-step Processing

Form submission triggers a workflow that includes email verification, database insertion, and welcome notification.

Nested Form with Dynamic Arrays

A form that handles dynamic arrays of nested objects, perfect for complex data collection:

Nested Schema Structure

                                                {
  "validatorSchema": {
    "order": {
      "type": "object",
      "properties": {
        "customer": {
          "type": "object",
          "properties": {
            "name": { "type": "string" },
            "email": { "type": "string", "format": "email" }
          }
        },
        "items": {
          "type": "array",
          "items": {
            "type": "object",
            "properties": {
              "productId": { "type": "string" },
              "quantity": { "type": "number", "min": 1 },
              "options": {
                "type": "array",
                "items": { "type": "string" }
              }
            }
          }
        }
      }
    }
  }
}
                                            

Dynamic Component Generation

The Component Engine dynamically creates form fields for each array item, with add/remove functionality.

Complex Data Processing

The Action Engine processes the nested data structure, validates relationships, and handles the complete order workflow.

Get Started

Getting Started Learn the fundamentals and core concepts Form Engine Build dynamic forms with validation and actions Action Engine Create workflows and business logic Component Engine Design reusable UI components