About Astonio

The Generio framework is an open-source JavaScript tool that generates ready-to-go data management applications that you can configure quickly and easily. Whether you are an individual programmer, a member of a software development team, or an in-house IT-specialist, you will find that it boosts your productivity and saves weeks of code writing.

Only three steps to a ready-to-use application

Download

or code the backend for your data source

Set up

your application and get a ready-to-use interface Program

any extra features that you require

Why choose the Generio framework

Its is free and

open-source

Its is free and open-source Mainly based on JavaScript

Mainly based on JavaScript Adaptive to any

data source

Adaptive to any data source Cross platform and suppors cloud technologies

Cross platform and suppors cloud technologies Easily integrated with web applications

Easily integrated with web applications Easy for teams of developers to use

How it works

The Generio framework works with any data source (be it a database server or any server application serving as a source of data and coded in any programming language).

The framework provides:

Mechanisms for the interaction of data objects and for displaying these interactions on your interface.

A backend the serves as a bridge between the framework and your data source.

Automatically generated forms (lists, records, filters) and interactive control elements for data processing.

On top of that, there is a vast set of tools that enables you to build the precise application you need. In addition, you can extend the framework itself or implement the modules created by other developers.

You can flexibly configure data source using your prefered language. The framework interacts with the data source using a corresponding backend module. It defines all the logics for how the data received from the data source is to be processed and what data is to be sent back. In the backend you define a communication protocol with the data source. Alternatively you will soon be able to download and set up the pre-built backends that are available for various data source types.

Once the framework has generated an application, you may wish to keep it as it is, or code new extensions to it. You can enhance the interface to meet your needs by using our set of JavaScript modules and functions, and you can extend the data source server's logics in your programming language. The framework provides you with a choice: to develop an interface or its part quicker yet less flexibly, or develop it more slowly yet create a more functional interface.

In-built interface

In the in-built interface, all the data editing elements are designed to be used both in forms and in tables. The elements have useful features that simplify data processing for the user. Let us have a look at a few examples.

Here is an example of a text field.

By clicking the corresponding button, it expands into a bigger field, which is helpful when there is more text than the small input element can accommodate.

When it comes to numeric input elements, they support math expressions right inside them.

The object selection element also has a few input modes: it allows the choosing of objects either from a drop-down list with an in-built search function or from a standalone popup form.

As for data input errors, the framework’s interface shows them not under the element, but rather inside it as a special marker. Such an approach means that the density of form elements is kept and their arrangement is retained when mistakes appear. The mistakes are displayed in the same way when data are presented in the table mode.

Interaction between interface and data

In the framework, much attention is paid to efficient interactions between records (objects).

Thus, when a user selects a record in a list and modifies it in the opened form, the record gets updated in the initial list automatically.

When a record is being changed simultaneously on different devices, users get instant notifications about any changes happening to the record they are working with.

The framework’s interface also allows for a mechanism that sorts the rows of dependent records (if it is supported by the data model being used).

These examples amount to only a tiny part of all the features put into the framework. A more detailed description is the subject of separate articles. Also worth repeating, none of the tools or methods are compulsory; they are only presented as the basis for development and can be configured according to the will of the developer.

Models and managing data

When it comes to operating data, a distinction of the framework (compared to Django, for example) is that for describing lists of records and single records, it uses different types of models – namely ListModel and RecordModel. Such an approach allows for displaying lists of not only records from a few models at the same time, but also non-editable rows (for instance, certain results of processing those records).

Despite having the necessary mechanisms to do so, the framework does not require data models to be described when developing an application. Instead, the Backend module generates the necessary data models based on those that already exist in other environments (such as Django, Sequelize, SQL etc).

The framework shares some features with Django. For instance, the classes used for data queries (QuerySet and Query) are the equivalents of the same-titled Django classes adapted from Python to TypeScript code. Data selection from a database can be coded like this:

backend .getListModel('product') .getQueryset() .filter({name__icontains: "Jacket"}) .orderBy('-price') .limit(0,10) .getRows() .subscribe(products => {…});

Another distinguishing feature of the framework is virtual fields. When a virtual field changes, it may subsequently change real fields of objects it represents and vice versa. Something similar occurs in Django when we use xxxxxx_set property to get objects linked to other objects; or when we access an object through a property, when the database stores only this object’s id.

In the illustration below, fields product_id and product_name are real, whilst field product is virtual.

The framework supports the ‘lazy loading of dependent records’. Unlike Django though, here a programmer is free to decide either to use this mechanism or toget data instantly to reduce the quantity of queries between the client and the server. Thus, in the example above, the product ‘product’ has the field ‘supplier’. By default, suppliers would be drawn from the database only upon request to the field product(‘supplier’); however, after modifying the code like this: .getRows('supplier').subscribe(products => {…}); – each product from the list ‘products’ will also contain data about relevant suppliers and there will be no need for a separate database query to access these data.

Check it out

If you wish to try out the framework, you can have a look at an example of an application written using it. To install the application, run the following command:

npm install astonio-app

Then run:

npm install

Then open the file app.module.ts, set up access to any MySQL database and build the app:

npm run watch

after which you only need to run it:

npm run app

The framework is available at github.

The instructions for designing applications based on the framework: Quick start

An example of a more elaborated application is available here (the setup guide is in the README.md file).

Learn more

To learn more about the Generio framework go to Quick start or read about it on:

• Habrahabr: habrahabr.ru/post/339870/ (in Russian)