Create app structure v0
You probably was used to use React components to create app structure. Since Frui.ts applications are ViewModel driven, we have to create app structure at VM layer.
We created @frui.ts/screens package which helps you to dealt with it.
Screens we called special subtype of ViewModels which serves to define app structure. We have four abstract parents which you can use it. From thease only four types cou can create every structure you can imagine.
Most common parent which represents unit of screen part. The biggest difference between ScreenBase and any ViewModel is presence of lifecycle.
You know React components has lifecycle, as well @frui.ts/screens has lifecycle too.
The concept is same only in different program layer. At React components is straightforward because components appers on device screen directly. For ViewModel layer you need to thing about it first.
ViewModels are created in different time of application life. Some of them when app is loaded, some of them later when factory is used to create them and some of them could be uncreated all the time, when user did not neeed the part of application which they serve to.
Contructor of ViewModels isn't for that reason good place for many things, to fetch data, subscribe browser events, etc.
The right place to init these things is onInitialize method. This method is called only once when specific Screen appears on device screen for first time.
The other option is to use onActivate method. This method is called every time when particular Screen appers on device screen.
Maybe you asked yourself how what is difference, how could Screen appears on screen again for a second time? This happens because some application parts could be closed or switched. For example when user move in navigation to another page and then go back.
When some Screens disappear from the screen onDeactivate method is called. This method is best place to clean your mess. Unsubscribe events, unsubsribe reactions or data backup.
The lifecycle is not the only one benefit which ScreenBase brings to you. Other important thing is introduction of main concept for navigation.
Every Screen could have navigationName. This attribute is used to create navigation path (URL).
When you fill navigationName the Screen become routable. The more about that will introduce later.
Not every Screen is supposed to be routable. For this parts just leave navigationName empty.