Custom Low-Code Pages and Apps

Endless customization

Custom Pages

In jestor, you can create custom pages in which everything is created by you, even the interface. This tab will only use jestor's overall structure (menus and settings), but the content of the page itself will be defined by your own back-end and front-end customizations.

This allows users to create fully personalized parts of jestor, and even create internal apps for specific functions.

Creating a Page

To create a page, access the Developer Area and click on Pages, then +Create new page. Name your new page and press Create.

📘

The page's URL

This new page will be accessible through jestor's menu, and it's URL will be:
your-org.jestor.com/custom-app/name-of-the-page

After the page is created, you'll be able to customize back-end and front-end on their designated consoles. On the example below, we fetch the first record of the table Leads and print their name and status on the page.

1867

Here's the back-end part:

$searchLeads = Jestor.loadData('leads','id_leads asc');
$searchLeads = $searchLeads[0];

And here's the front-end part:

{{ $searchLeads['name'] }}
<br>{{ $searchLeads['status'] }}

Using PHP on the Front-End

In the example above, you can see that we use jestor's native method Jestor.loadData to fetch data on the back-end console, and then use it on the front-end console to display information to the user. In jestor, you can run PHP functions directly on the front-end console by using the format {% %}, as we can see on the example below:

{% $jestor = "Gestão do seu jeito!" %}

So we could, for example, run the Jestor.loadData directly on the code above. In the Leads example, we run this search on the back-end and then access the resulting value on the front-end by calling on the variable that received the data on the back-end ($searchLeads).

Then, if we wish to show this result to our user, we can use the format {{ }} to print a value on the page. This is what we did on the Leads example:

{{ $searchLeads['name'] }}
<br>{{ $searchLeads['status'] }}

By using this structure, you can run things like If conditions or loops and show a dynamic result on the page.

You can also create specific functions and styles to be called on the page, allowing you a great deal of personalization both structurally and on the user interface.