Welcome to this episode of CoreDump, the one stop for techies, in this episode we have gecko talk about writing html5 forms with many JS frameworks, and persistence to databases.
Gecko: Writing forms is very easy with html5 and JS, we consider an example application, an admissions app for a fictitious masters degree in software engineering.
Hobbes: With so many masters streams mushrooming, maybe it is the next in-thing?
Gecko: I need to emphasize the architecture and heuristics, design is first class and development just the leg work, a framework comes handy and low code is the way.
Calvin: Just to play the coding puritan, low code in html is WYSIWYG, or what you see is what you get, I just rule with my ruler and actually measure all over the monitor, taking for ever to write CSS, at the end of it, I get paid for a year of hard work, you realize it was so much hard work, with the ruler? If you use a WYSIWYG low code, you can design in a day, and get paid just for a days work.
Lisa: I get paid by resource, not time and man hours, so I get paid the same, and WYSIWYG is fine, maybe we will develop something better, after all are not circuits visually designed? with CAD? Why is it not WYSIWYG?
Gecko: Circuits live.
Lisa: Code lives too, the web too and JS is real and alive!
Gecko: The architecture is minimalist, with JSON based persistence, to server-less and client side databases, maybe we can use tinydb, and the per-observer pattern, dr bheemaiah, invented, we have data-structure versioning.
We can use the MVC pattern with Angular or ReactJS + Polymer for object based rendering, or Reactive, with streams. I personally prefer RxJS!
since DOM = JSON = XML, all html5 is essentially the DOM and persistence to JSON in a db takes the per-observer, leaving one design issue, the rating and map to the accept/reject predicates. We need to design the RPA for this.
The DOM objects are Years of Experience(YOE) , minimum education (Yes/ No)
For a simple admissions form, since every such fictional education institute capitalizes on professional experience, we have three RPA rules:
Threshold experience: YOE ≥ 3.
Quantification of Experience: Qu[YOE.Projects] > qu_threshold_YOE.
Minimum Education: has_4_year_degree[Education.Degrees]
This would suffice as simple admission criteria. Coding this on DOM, would need a simple RPA package, to process the DOM data structures.
We have three design choices, the older outdated MVC pattern or using ReactJS to render the maps and implement the RPA or use reactive with iterating on a stream and event space from the DOM data, or plain vanilla JS, for DOM and RPA scripting and three resources, in DOM, a success DOM, a reject DOM or a deferred Decision DOM.
So we roll up our sleeves to code this.
First the DOM for the forms and data collection. Today we can just use an interactive tool in office 365 to design web forms. Any template is chosen for the required data structures, YOE.Projects and Education.Degrees and PI.name and PI.contact_information.
We need to add a UI mechanism to add unlimited Degree and Project objects to Education and YOE DOM objects.
Next we add a script for the rule engine and script the rules from the DOM.
The easiest way is to find a ready RPA JS framework and a way to code the per-observer pattern. There are a number of DOM to JSON translators.
With a Google search for “RPA JS” we find.
Cylon allows for html/htmls APIs for remote code execution as well as on local browser and tinydb versions with DOM to JSON conversion.
If we google a DOM to JSON dump for JS, we get:
Lisa: Three Cheers to Snippet coding with github gists!
The rest is straightforward, to tinydb. Basically writing RPA as a JSON object, and saving JSON on tinydb and using Cylon!