Skip to content
Augustin Šulc edited this page Mar 25, 2022 · 3 revisions

Frui.ts is a set of tools and helpers you can use to simplify your job. It consist of several packages that you can use separately. Togheter they creates MVVM framework for build frontend web applications with no pain.

View models

The working or business logic layer. In this point is no matter what you use for render. We recommend to use React, but door are open to use other frameworks like Vue.

  • Screens - components for application structure, navigation, etc. For example, ScreenBase, ConductorSingleChild, Busywatcher, Router.
  • Data Screens - base classes for data-focused applications. For example, FilteredListViewModel, DetailViewModel.

Views

  • Views - components for binding UI to ViewModels. For example, BindingComponent, View.
  • Data - helper functions for rendering sorted and filtered data. For example, IPagingFilter, pageChangedHandler, setSort.
  • Data Views - higher-order components for displaying data. For example, DataTable, DataRepeater.

Data

  • API client - abstraction over network calls and fluent request builder. For example, FetchApiConnector, RestRequestBuilder.

Validation

  • Validation - standalone solution for MobX-based entity validation.
  • Dirty checking - standalone solution for MobX-based dirty check flags.

Helpers

  • CRA template - Create React App template
  • Generator - code generator for saving time in typical scenarios.
  • Helpers - shared helper functions used on various places in Frui.ts. For example, @bound, createMap, nameof.

UI components

  • Bootstrap - UI components suporting two-way binding based on React Bootstrap, For example, Input, Select, Check, ValidationControlBase.
  • HTML controls - UI components suporting two-way binding based on plain HTML controls. For example, Textbox, Checkbox.