Further Explanation and Onboarding

Sign-In to our Free Trial and visit the Frontend Graph in Generato. Click the the Show Frontend Features Button in the Menu on top to run through our detailed Onboarding.

The Frontend-Graph

Within the second layer of the GeneratoGraph, the Frontend, users can conceptualize the User Interface of their application through Pages, Components, their references and their navigations. The units will be translated into your code with the selection of bundle-templates.


They describe the appearence of one Page. In the resulting code only one Page is visible to the user at once. Pages may contain components, or link to other Pages with Navigations.


Components describe closed unit, which is defined on itself with a special functionality and may be recycled for different manners. You also can add these Components, link them to other Pages or Components by References or set new Navigations to other Pages in the Backend-Graph.



Within the Frontend-Graph two different types of relationships can be created. One of these relations is the Navigation. When a connection is drawn from a Page, it will automatically be defined as a navigation, which proposes that there will be redirect. Navigations, and other details, can also be defined in the References Tab of the Component/ Page detail windows.


On the other hand side there are References, which will be chosen if the relation is drawn onto a component. These references determine that a page/component contains this other component, or to be more precise the one component will be used/shown onto the other reference.

References to Backend elements

You can find the References tab within the Component/ Page detail windows, by either creating a new Frontend element or by double-clicking on one existing element. Here you can see existing relationships to the backend units or other Frontend elements or actively establish new references to them. Moreover, keep in mind, that you may reference backend entities in your Frontend components. That way you can easily visualize your data. 

In order to generate your code, make sure you have the right templates for your pages and components in place. 

Did this answer your question?