UI library for building forms, editable grids and reports | UIKernel | UIKernel

Simple way to manage complex interfaces

UIKernel is a comprehensive React.js UI library for building forms, editable grids with filters, based on a simple unified record model with client-side and server-side validations and data bindings.

What you can do with UIKernel components

Interact with data

You can set up grid not only to display data but to add new records, update or delete them.

Filtering

UIKernel grid supports filtering by different fields.

Sorting & pagination

Sort data by default order or by user choice and paginate the data.

Data source

Pass data from static array, REST service or any other source to UIKernel model.

Convenient inputs

Each form input or grid cell can be one from UIKernel editors: date picker, suggest box, number, select, checkbox.

Validation

Use UIKernel validators to check fields on client or both on client and server. Also custom validation rules can be applied.

Data export

Export grid data in JSON or CSV formats for further interaction.

Synchronize multiple components

Automatic synchronization of multiple forms and grids with a shared data model.

Bulk operations

UIKernel grid support performing massive operations on records.

Basic grid example

Speeds up development

You just need to pass a model and configuration to make a component appear on your page.

<UIKernel.Grid
  model={model}
  cols={columns}
/>

Code clarity

UIKernel tries to avoid unnecessary abstractions, giving you the opportunity to define a model as you want. Nevertheless, there are basic implementations that work with client data and models linking server and client interface using API.