Share My Creation [BANanoVuetifyAD3] Create VueJS+Vuetify based Websites / WebApps using the Abstract Designer


FEATURED: Create a News Website / WebApp with less than 100 lines of code
FEATURED: Create an Online Store Website / WebApp


BANanoVueAD YT Playlist

BANanoVueAD is based on BANanoVueMaterial however in this case one uses the Abstract Designer to create websites / webapps. This library as much as it focuses on design, one is also able to write source code as in normal b4j app. One is able to create a website / webapp exactly the way they want as one is able to use more than the 150+ components to build whatever one can imagine.

We are currently however building up usable blocks (as layouts) that one can use.

Some silly assumptions:
  • You have explored some BANanoVueMaterial
  • You are familiar with VueJS
  • You are familiar with Vuetify and off course (this will help you in designing your own blocks)
  • You know BANano.
We have prepared some videos here to take you along and all source code (both library + examples) are downloadable per link above.

From the AD


To a Website / WebApp


Last edited:


Licensed User
Longtime User
BVAD3 is now out of BETA.

There are tutorials here on how to use it to create websites / webapps.

Remember, BVAD3 is MIT licensed. Do whatever it is with it to your hearts desire.


Licensed User
Longtime User
Version 7.35 Maintenance is available.

For Newbies, download all Additional Libraries (Extract in your Additional Libraries Folder) / Follow instructions to install from Github.


The BVAD3 library has been split between Full and Core

- this can be locally hosted or CDN. This version includes all plugins.
Core - this can be locally hosted or via CDN. This version excludes all plugins.

CDN version will require a constant internet connection to work whilst others don't.

Existing users, download

Full BVAD3 or Full BVAD3 CDN OR
Full BVAD3 Core or Full BVAD3 Core CDN

BVAD3 Builder

This web app helps you tree-shake you app by only extracting only the used classes, css & js files used on your final package. Use this tool just when you are fished coding and are to publish your final version of the app.

As this needs PHP to work properly, you will have to run it on you dev webserver. Get this here.

BVAD3 VFlexDialog Builder

This web app helps you generate the source code for your VFlexDialogs. Examples of how a functional VFlexDialog already exists in the Kitchen Sink WebApp.

You can run this directly from Netlify. The repo for the running source code is available from Github

PS: The Kitchen Sink WebApp showcases all the working examples of this library. Whilst its better to host and run this locally, you can explore it from Netlify.

Happy BVAD3 Coding.