Commonly Used PWA Platform Tools
No Code Tools ~99% of Work
The most common tools are definitely related to creating UI and it's logic. This was done using the left and right panels in Constructor. Left for UI components and their relative nesting within each screen. Right is the visual and logical settings of each component.
As an example of a slider card on Home screen, we nested a "Slider" component inside of several "Flex row" components to achieve cards look, then filled the Slider with data from app's backend "Looping" (or iterating) data from the Filter.
We used Filters very commonly throughout the app. Filter is very similar to a visually built SQL data call.There are over 30 filters in this app.
In the sample above you can see a reference to Filter named "GD", short for Good Deeds, in the slider card. Also here is a sample screen shot of how this Filter looks like in Mobsted settings.
This Filter gets NewGoodDeeds that are "active" and "do not belong" to the current user, meaning - all other peoples Good Deeds are returned.
Last most commonly used in this application block of tools is API operations, as we created an internal set of API calls to change several pieces of data in app's own backend.
For some of the required functionality we were unable to implement using no-code tools and had to use custom code blocks.
One was a call-to-action pop-up based on condition - show once only upon app open. Mobsted PWA building platform does have tools to show/hide screen elements based on logical or mathematical conditions, on filtered data results and other things, but for some reason pop-ups do not have access to most of those conditions.
Thus it is tricky to make custom pop-ups, but doable with Custom JS. To achieve a pulsing heart in app, we created a system widget and filled it with JS code for the content:
Then we added a new Action to the Home screen itself and made it as Custom JS. Then we applied needed logic for when this script would work, in this case with a delay:
Another Custom block, which we plan to implement using the Custom PHP module of Mobsted (for the version 2.0 of the app) is a lottery system with randomizing and prioritizing logic to automatically assign sponsor prizes to users who submitted most acts of kindness.