Turn static HTML into a web application with MAVO

Without programming skills and without backends

Mavo is a javascript library that extends HTML and allow the rapid development of simple web applications:

– Mavo extends the syntax of HTML to describe Web applications that manage, store, and transform data.

– Store data in the cloud, locally, or not at all by just changing an HTML attribute

– Edit data right in the website, with an intuitive, auto-generated, customizable interface. No more wrestling with CMSes and servers!

– Multimedia uploads in your page via drag & drop, pasting, or browsing, without a single line of code.

– Perform calculations right in the HTML, that update when needed. No need to write JavaScript!

All you need to do to use Mavo in any HTML page is to include its two files:

<link rel=”stylesheet” href=”https://get.mavo.io/mavo.css">

No programming code to write and no servers to manage: you can make any element editable and saveable, or turn HTML elements into a collection, with customizable controls for adding items, deleting items, and rearranging items via drag and drop, just by adding one HTML attribute to it.

The web application data can be stored locally in the browser, on Github or on Dropbox.

An example?

Let’s try to create an editable page, with this simple code:

You can see the result here: http://apps.andreafortuna.org/mavo/index.html

Some highlights:

  • mv-app=”homepage” set the app a name and activate Mavo on the page
  • property attributes identify the elements that will become editable and will be saved.
  • mv-storage defines where the data will be stored.
  • mv-plugins=”tinymce” loads the TinyMCE plugin for rich text editing, and class=”tinymce” tells Mavo to edit this element via TinyMCE.

My opinion about MAVO?

Funny and interesting but still immature.
Certainly useful for small projects and simple webapps that can be done in minutes, but not yet usable on real projects.

Take a look to the project website:



This site uses Akismet to reduce spam. Learn how your comment data is processed.