Comidor platform offers you the ability to design your own apps through App Designer, using low code. Creating a simple application has never been easier, even for non-developer users. Comidor guides you through simple steps to help you publish your app.
Comidor App Designer offers a range of applications to cater to different needs. You can select the one that best suits your requirements from the following options:
- Table applications:
- Sequential apps (with workflows)
- Process-based workflow apps
- Simple non-process-based apps (Data-driven)
- Report applications
- Kanban applications
- Portal applications
Let’s explore a step-by-step guide on how to create and run a simple application.
Simple Application
The Simple app is a non-process-enabled table application. This type of table application is ideal for creating data-driven records. No workflows can be related to this type.
Access App Designer
To access App Designer, navigate to the main menu on the left side of your screen and select the following options: App Factory > Application Builder > App Designer
In the newly opened unit, click on the “Create an App” button.
Create App
-
To open the creation form, simply click on the “Create an App” icon.
- In the Application Type, select “Table Application”.
- Provide the Application Name and the Description.
- You can either choose from the existing options in the list or add a new Menu Header option. Depending on your selection, your app will be displayed in the corresponding menu header with a new icon. If you leave it empty, it will be included in the packages menu header.
- You can classify your app into a proper Category. Choose an existing category from the options provided or create a new Category. Categorization helps you easily locate your apps in the App Designer. Depending on the category you select, the app will also be displayed in the respective sub-menu.
- Collaborators are the users or groups who have access rights to this App. Choose one or more users(s), Group(s) from the list.
- Select whether this app is Basic or Supportive.
- Uncheck the “Process enabled” option. If you do not, you will not be able to link a Workflow to your App. A warning pop-up will appear. Click on “Proceed“.
- Define if this app has a Kanban view. If enabled, table records can be displayed on Kanban boards.
- Connect your App to an existing entity in the database. This option enables you to seamlessly connect to external databases associated with your account. Effortlessly view, insert, delete, or update records in order to sync data from different databases.
- There is an option to upload an Image for your App.
- Click Save to create your App or “Close” to cancel.
After saving your app, you will be redirected to the view form. Comidor will guide you through simple steps to design your app. Steps 1-5 are available for this app type.
1. Dashboard
In the Dashboard step, you will get an overview of your application. Specifically, you will be able to view:
- Quick Stats:
- Number of forms and Widgets created in this app
- Graphs that display the timeline of application activity.
- Basic Info:
- the Type, Category, and other parameters
- To edit the above information, simply click on the pencil button.
- You can define whether the application is Public or not.
- You can lock your app by selecting the “Locked” option. By enabling this feature, only the user who locks the app will have editing permissions in all steps. Other users will only be able to view the app but will not be able to make any edits.
- By selecting the “Has customizations” option, the application will not be exportable.
- Add a flag to remember if this application
- Collaborators: the users or groups who have access rights in this App.
- Comments: an interactive area that allows users with access to write and view comments.
2. Forms/Fields
In the second step, you have the opportunity to fully design your app in terms of the data structure and the visual elements. This includes designing the Data model, Table View, and User forms.
Data Model
- All fields can be found in the “Data Model” tab.
- When you open the Data model tab, you will see a sub-table with the following columns: icon, size, column name, created by, created on, last updated by, last updated on, the pin, and multi checkboxes.
- You can add all the fields that you want to be used in the App here.
- To create your own custom fields, simply click on the “+” symbol. Remember to reload the DB after adding all your fields.
- Click on the refresh icon to update the table.
- Type a keyword in the search area, press enter and the table is refreshed displaying the results that match the keyword.
- To create your own custom fields, simply click on the “+” symbol. Remember to reload the DB after adding all your fields.
- Alternatively, you have the option to import multiple user fields from a CSV file. Simply click on the “Import CSV-automated” button, select your CSV file, define the separator, and click save. This will automatically add all the fields from the CSV rows to your app.
-
To view basic information about an existing field, simply click on it. By default, you will see details such as Entity, Label, Auto-generate name, Column name, Type, Default Value, Store Type, Tooltip, and Security Level. If you navigate to the Connected Forms tab, you will find a list of forms where this field is used.
- Click on the “Export Data Model” button to export your data model, including all fields, in .xlsx format.
Table View
-
Specify the columns you would like to include in the main table of your App. By default, all the table fields you have created in the Data Model will be added as columns in your application table. Each field will have pencil and x buttons for editing and removing, respectively.
- You have the ability to easily add more Columns by simply dragging and dropping from the list of available fields.
-
To make any changes to each column, simply click on the edit button.
- Provide a label name. If left empty, the column will use the field name.
- Display a Prefix or Suffix before or after the value of each entry.
- Select your preferred alignment.
- Specify the preferred default width, in percentage, for the summary table display.
- Other options, such as set “Not Sortable” and “Hidden” are also available.
- Check the “Is Kanban Field?” option in case you want to display this field on the Kanban boards.
- Click “Save” to update this column in your table, or click “Cancel”.
- To re-arrange the position of the field columns in the Table View, simply drag and drop them.
- To remove this field from the Application table, click on the “x” button.
- Switch to mobile view to preview your Application table in a mobile device’s browser. Choose your preferred device (mobile, tablet)
Forms
All forms included in this App are visible in the “User Forms” tabs. You can create new forms or edit the existing ones here.
- By default, no form is created. The message “You haven’t selected a form. Please select one!” is displayed. Select a form, OK and the plus buttons are available.
- Click on the “+” icon. This will trigger a pop-up window to define the title of your new form. Once you have entered the title, click on “Save” to save your form. You will then be directed to the form designer.
- On the left side of your screen, under the Design tab, you will find the Elements (panel, section, code, paragraph, style, grid, group), a list of fields that you can include in your form, and a preview of the form. Easily search for the desired fields and add them to your form with a simple drag-and-drop action.
-
When you click on a field, a pop-up will appear where you can add properties for each field. You can define various properties for the field, including mode, label, tooltip, translated value, pattern, pattern error message, required, alignment, placeholder, element CSS, Element CSS Class, label position, size, hidden, Trigger event scripts on user entry, Disable changes by scripts on this field, is Area, Has QR Input, and the Area Size.
- Under the Settings tab, you should see the following Basic fields: Record type, Title, Access, Main, Primary, Quick, Position, Form Division, Mobile form, Approve/Reject form, and Validity. In the Advanced section, you will find fields such as Script before open, Script before edit, Script before save, and Template File.
-
Discover more about the various functionalities of form designs here.
-
-
The form designer also offers the following buttons: Add tabs, mobile view, toggle fullscreen, publish, copy, and delete.- You can also make a form Main, which will be visible in the main record as a tab. Specify the position of each form that you would like to display.
-
To start the app with a specific form, select the option “Replace existing form” in the Primary field. This will allow you to initiate your app from the “+” icon of the summary table.
-
In the “Quick field”, you have the option to choose whether you want the form to be visible in the Quick Add menu or in the process templates list. This allows you to initiate your app from the Quick Add menu if desired.
- Remember to Publish your form after finishing your design.
-
Additionally, you have the ability to edit existing forms from the “Forms” tab. Simply select the desired form from the list and click “OK“.
3. Graphs
In step 3, you have the option to design your app’s Graphs or Widgets. Comidor Widgets are the perfect choice for data visualization, allowing you to display the most up-to-date data in the format you define.
- Create your own personalized dashboard in seconds!
- Combine multiple views of data to gain a deeper and more comprehensive understanding.
Creating a new graph is easy – simply click on the “+” icon.
Discover more about various types of Widgets and learn how to create them.
4. Advanced
Maximize your use of the App Designer by taking advantage of its advanced options. This includes incorporating user tabs into your app’s records or tables, utilizing event scripts, and implementing field rules to dynamically show or hide fields, sections, or tabs in forms based on specific conditions.
User Tabs
Utilize tabs to maintain complete control over the accessibility of your application.
- The tabs can be found either inside records, appearing as a tab on the left side of the record, or in the summary table of the application.
- A tab can be a table sourced from any Comidor entity, HTML, or widget.
- You can easily create a new Tab by clicking on the “+” icon
- The Record type is disabled by default and is named after the app.
- Select the Type of Tab you wish to create: Table, HTML, or Widget.
- In Type Table:
- Provide a Title for the Tab.
- In the View Tab in: choose “Record”.
- Select Query: the queries used to define which fields are to be fetched as columns from specific tables
- Where Clause: type a specific condition that needs to be met
- Access Code determines who has permission to access this tab.
- Select “Type HTML” when you want to add guidelines or other important information for a specific app:
- Provide a Title for the Tab
- In the View Tab in: choose “Record” or “Table”.
- Access Code determines who has permission to access this tab.
- Init-action – insert the HTML here
- In Type Table:
-
- Type Widget: a tab to monitor all the widgets (general or application widgets)
- Provide a Title for the Tab
- In the View Tab in: choose the “Table” option.
- Access Code determines who has permission to access this tab.
- After saving this tab, click on the “Add widget” button to Select the widget you would like to display.
- All added widgets are displayed on the Linked Widgets tab. To remove a widget from this tab, simply click on the ‘-‘.
- Type Widget: a tab to monitor all the widgets (general or application widgets)
Field Rules
The field rules functionality allows you to hide or show fields/sections/tabs within forms based on specific conditions being met.
To view the sub-table of all field rules, simply click on the “Field Rules” tab. You will then be able to see the following columns: Rule title, Field(s), Section(s), Tab(s), Created by, Created on, and the pin button.
- Refresh button: The internal refresh function updates the table and presents all the updated records.
- Search option: Type a keyword and press enter to see the respective field rules.
- Pagination: allows users to easily divide and display table rows into pages. You can choose the number of rows you would like to be displayed per page and conveniently navigate through the pages using the Previous and Next buttons.
To create a new Field Rule, simply press the “+” button, and the creation form will open.
- Give a Rule title
- Select the Action to be performed: You can either Hide or Show.
- On: When choosing between fields, sections, or tabs, you can decide what you want to show or hide. Depending on the option you select under “ON,” the corresponding lists will appear.
- Specify the Form in which you would like this rule to be applied, considering the user forms where the selected field is displayed.
- Select the name of the Field(s)/Section(s)/Tab(s) on which you would like to perform the above action. To add more rows, click on the “+” icon. To remove a row, use the “-” symbol.
- Select the desired “Save” option (refer to Quick Reference Guide for assistance).
Custom Condition Builder
After saving the Field Rule in your sequential app and being on the view form, you can add conditions.
- To insert a new row, simply click on the ‘+’ icon.
- Select the unit from which the field originates (e.g. Process, Application name, etc.)
- Select the Field Name and enter its corresponding value.
- Use AND, OR, and parenthesis to form your conditions
-
Once you have added all the necessary rows of conditions, simply click on the “Publish condition” button.
Manage Field Rules
- If you want to make changes to a Field Rule, simply select the respective Field Rule and click on the pencil icon.
- After making any changes, click on “Save“.
- To change the conditions, simply make the desired changes in the view form of the Field Rule and then press the “Publish condition“.
-
To Delete one or more Field Rules, simply multi-check them in the Field Rules table and then click on the “Delete” button.
Data Objects
Data objects are discrete units of information that are structured and organized within a computer system or database. When we use the term “data object”, we are essentially referring to a set of data that should be considered as an independent entity. Data objects come in a variety of forms, such as data tables, lists, forms, pointers, records, files, and sets.
With data objects in Comidor App Designer, you can enhance the functionality of your event scripts in any app. It allows you to quickly and effortlessly create any type of data set you require.
- To create a new Data Object, simply click on the “+” icon.
- Create data sets, variables, lists, forms, records, or action data types and define their properties.
- Utilize those data objects in event scripts.
Event Scripts
In this tab, you can write scripts for a specific Data Type to be executed before/after/during a specific event.
To create a new Event script, simply click on the “+” icon:
- Add the “Procedure Name“.
- Select the Data Type (apprec, task, process, dataset) and specify where you would like the script to be applied.
- An Event Type can be inserted, updated, deleted, etc.
- Add your code to the Procedure Body.
- This is designed for advanced users to document their procedures.
5. Configuration
In this step, you can configure the sequential application.
- Decide what you would like to include from the Basic options
- Notes, Tags, and Links.
- If the Kanban view is enabled, define the “Group by Field” and the “Title Field“. The “Group By Field” is used to categorize boards, while the “Title Field” will serve as the title for each board.
- The ability to create, edit, and/or delete an entry.
- The Activity history tab
- Decide whether you would like to include the print/export options in the summary table of this application.
- Allow user layout change; the ability to change the table’s categorization, and the pin button to remove columns.
- Define a Primary Field (Record Identity: Appears in lists, etc). To define a primary field, select one of the fields you created in step 2 from the drop-down list.
Customize your data by: - Defining a Numeric field as Incremental, and in every new record, it will automatically increase by one with every new record. Additionally, you have the option to specify the starting number.
- Setting a Prefix and Suffix to the app as well as a Text Primary Field; select a text field from the Data Model that you want to auto-populate a number, eg. for this app the requests will be labeled as SR.1, SR.2, and so on.
- Add the same text field as the Primary Field (Record Identity) as well.
- Selecting a default categorization for the table view based on a specific field (Title, Priority, etc.) – up to level 3.
- Choosing a specific field to display the Summary table in ascending or descending order.
- Defining up to 3 key-value list fields to be included as custom filters on the left side of the table.
- Granting access and change rights; select one or more users/ groups/roles.
- Setting up to 3 numeric fields to be displayed as Totals in the table (Sum fields 1, 2, 3).
-
You have the ability to fully customize the app layout by selecting font sizes and colors in the CSS Design options.
- Add your custom CSS and custom JS:
Easily incorporate custom CSS and JS within the App Designer, unlocking endless possibilities for personalization and enhanced functionality as you build your app. Simply add your custom CSS and JS rules in the Configuration step of your app. Remember to publish the app to save your changes.
Publish your App
Once you have perfected your design, simply click on the Publish button to Publish your app.
Your app is now ready to use!
Note that you can create an Application with NLP in just 4 simple steps. Find out more information here.
Edit Apps
If you want to edit an existing User App, go to the main menu on the left side of your screen and select the icon App Factory > Application Builder > App Designer. From the list of applications, select the one you wish to edit.
- To apply any changes to the basic information of the Portal application, simply click on the pencil button.
- You can navigate through steps 1-6 by clicking on the respective step and making any desired changes. Do not forget to publish your changes.
- To export the current application, simply click on the Actions button and select Export.
- If you wish, you can delete a User App. Simply open the App you want to delete and click on the Delete option from the actions button.
- A confirmation pop-up has appeared. Click “Confirm” to proceed with the deletion or click “Cancel“.
- You can also check the Linked Entities that will be affected in the respective tab.
- Finally, you have the option to choose “Copy” to duplicate the current application. A pop-up will appear, allowing you to define the name of the copied app.
Run an App
-
When viewing an app in the App Designer, running it is a breeze! Simply click on the Play button located at the top right of your screen, and the quick add form of this app will be automatically populated.
-
If there is no quick add form available, a corresponding message will appear and you will be directed to step 2 in User Forms to create a new quick add form.
See the Table
Users can apply the following actions in the table applications:
- Access the table based on the access rights specified by the designer.
- Choose to either print or export the table results.
- Apply filters, categorize, and search within each table.
- Access, edit, or delete each record.
- View records in either table, kanban, or graph views.
- In the graph view, you can easily create pie, bar, or stack charts using real-time data and apply desired filtering.
- To view the User Apps you created and published through App Designer, follow these steps:
- On the left side of your screen, locate the menu.
- Select either the Packages Icon or the Header Menu you chose in Step 1 of App Designer.
- A list of all the published apps will be displayed here, categorized based on your Category selection in Step 1 of App Designer.
- If no category is chosen, the app will be shown under “Packages”.
Select the one you wish to access, and it will open in a new tab.
By clicking on the “+” icon, you can create a new entry of this app ( to see the “+” icon, you should have first checked the respective option in the Configuration step of App Designer). A new tab will open with the form created in the App Designer. Fill in the fields and click on “Save” to add this entry.
See the Record
In a simple app, the record appears as below:
- You can see the main forms you have created, with the primary form being the one you chose to replace the existing form.
- To edit any field of your record, simply click on the pencil button.
- The comments area and the actions button depend on the configuration options of your app in the App Designer.
Discover more about App Designer and learn how to create different types of apps here.
