https://jinntec.github.io/Fore/doc/index.html

 [light7]

Declarative user interfaces in plain HTML

Get Started learn more Home Demos
#424242 #9e9e9e hex2rgba = (hex, alpha = 1) => { const [r, g, b] =
hex.match(/\w\w/g).map(x => parseInt(x, 16)); return `rgba(${r},$
{g},${b},${alpha})`; }; var characters =
["a","b","c","d","e","f",0,1,2,3,4,5,6,7,8,9]; var randomColorArray =
[]; for (var i = 0; i < 6; i++) { var randomIndex = Math.floor
(Math.random()*characters.length); randomColorArray.push(characters
[randomIndex]) } const hexCol = `#${randomColorArray.join("")}`;
return hex2rgba(hexCol,0.9);

No Code or Low Code

Write complete interfaces without (or minimal) scripting.

built with Web Components

Fore extends HTML with Web Components for processing and displaying
your data.

Data-driven

Load, process and submit multiple data sources in XML, JSON and other
formats.

Just pure tags

Build fully interactive user interfaces from pure markup with
data-binding.

From simple to very complex.

{"greeting":"Hello Universe"}

{?greeting}

A clock

The model holds structured data in one or more instances.

Bindings apply calculations (or constraints) to the data.

Predefined Actions mutate, load or send data, interact with the user
or trigger events.

NoCode is fine most of the time but still you can define your own
custom functions to reach out to some script.

The state engine tracks dependencies and updates the user interface
as needed while dispatching lifecycle and state events to hook in.

When initialized the 'ready' event will start an endless loop that
updates the time with a delay 1000ms. It does by calling a custom
JavaScript function.

The bindings will recalculate their values and the UI will update the
template expressions - the ones in curly brackets.

12:30:00 0 0 0 0 const now = new Date(); return `${String
(now.getHours()).padStart(2, '0')}:${String(now.getMinutes
()).padStart(2, '0')}:${String(now.getSeconds()).padStart(2, '0')}`;
Fore
{time}

More features

group, repeat or switch

Repeating (even nested) sections of the Ui or switching between views
is no problem with the respective Fore elements.

Generic Control

Use either native or third-party components acting as controls within
Fore.

MVC Architecture

Fore elements fall into 3 categories: model, user-interface and
action elements that act together in a defined lifecycle.

Constraints

With bindings data nodes can be constrained or be calculated from
other data. Flexible alert messages can be logged to the user.

Dependency Tracking

Fore keeps tracks of the dependencies that might exist between data
nodes.

XPath/XQuery 3.1 support

With fontoXPath Fore uses a powerful expression language to address
either XML and/or JSON.

Submissions

A submission can load data from or send them to a URL.

Responses can be handled depending on returned data and trigger
further actions.

Framework agnostic

Fore is pure vanilla ES6 and not dependent on a specific framework.

Fore is brought to you by

[jinntec-bw]
For professional support contact us at
info@jinntec.de

Links

  * Twitter
  * Github
  * Discussions

this page is powered by
[light7]