I created the same Vuetify WebApp 14 times…
Crazy right?
Well, not so much. You see, I’ve been wanting to explore all back-ends I can get my hands on. So I embarked on showcasing how the same full stack web app can be created using different back-ends, and sharing 99.9% of the code base.
This starts with BANanoVuetifyAD3, a wrap I created of the beautiful Vuetify Framework, on top of B4x and BANano.
I have been enjoying my experiments with Vuetify 2 so much, so I thought that one of the areas that I have not done a lot of justice to is having BANanoVuetifyAD3 aka BVAD3 as a favourably call it, talk to all sorts of back-ends. I have developed free and paid webapps for it, but these did not touch on most of the back-ends. So I started slowly and what I wanted to ensure that I use 99.9% of the code base I use.
To be successful on this I created a DataSource class. This is like the old VB6 data-source control, that you can link to a back-end of your choice. Over time I extended this data-source to abstract most of the functionality to a bare minimum, and yes, some of the child classes use PHP and some use pure old fashioned Java libraries.
One of the other things I wanted to achieve was that anyone who wants to, can just be able to select a menu option, and be able to generate a complete running project based on a pre-defined BVAD3 Project Templates without a sweat. In b4x, these are called b4xtemplates i.e. small files that contain classes, views / layouts and some business logic.
So, when one selects one of these templates from File > New, and then specify the project name, a project is created based on the selected BVAD3 templates. The 14 webapps that I created are based on this templates.
For example, the BVAD3 CouchDB template, when selected it allows one to create a Full stack Vuetify WebApp using CouchDB as a backend. One installs CouchDB and updates some settings on the app and they are good to go.
Below are the 14 Vuetify WebApps and their YT demos with links to the source code.
BANanoVuetifyAD3 — Full Stack WebApp using Vuetify, MySQL, Java Jetty & Hikari Pooling (No PHP)
BANanoVuetifyAD3 — Full Stack WebApp using Vuetify, MongoDB & Java Jetty (No PHP)
BANanoVuetifyAD3 — Full Stack WebApp using Vuetify & FireStore (FireBase)
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & MongoDB PHP
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & MySQL PHP
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & SQLite3 PHP
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & IndexedDB
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & CouchDB
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify, SQLite & Java Jetty (No Php)
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify, MSSQL, Java Jetty & Hikari Pooling (No PHP)
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify, PostGreSQL PDO PHP
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify, MSSQL PDO PHP
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify & MSAccess PHP PDO
BANanoVuetifyAD3 — Fullstack WebApp using Vuetify, MSAccess & Java Jetty No PHP
What I loved about the xperience, was that whilst these 14 apps do exactly the same thing, the back-ends span different methodologies. Some of the apps can be easily deployed to any web server, whilst others will require a VPS i.e the ones using Java Jetty WebServer, others of course are server-less, or are they?
When exploring the videos, you will note that changes of the 1% that needed to be done involves the Data-Source setting of the database, a few config.php files and a few additions to the source code, otherwise most of the code is 99.9% the same code base.
BTW, the “BVAD3 Server…” project templates are all the ones based on Java Jetty deployments whilst the ones with “…PHP” will fit into any PHP compatible webserver.
#SharingTheGoodness
You can find more amazing stuff on BANanoVuetifyAD3 from Mashy Teaches WebApp/Website Development with BANanoVuetifyAD3 — The New Series
