Getting Started With JSBlocks MV-ish FrameWork -Tutorial Savvy

JSBLOCKS is a new Model-View-ish framework.It means it handles all MVW,MVC architecture.
It provides server side rendering,fast and modularity.
The entire framework is built on top of virtual DOM.
you can find more information about JSBLOCK in following link.

http://jsblocks.com/learn/introduction-why-jsblocks

In this demo,”We will learn to install JSBLOCKS and create a simple example”.
JSBLOCK can be installed using bower install blocks command.The following screenshot shows the terminal with JSBLOCK installation.

On successful execution of above command it downloads the blocks.min.js file inside bower_components directory.
A index.html file is created to include the JSBLOCK library.The updated directory structure looks like following screenshot.

We have created index.html file to demonstrate the use of JSBLOCK.The following code shows the content of index.html with 2 observables number1 and number2.JSBLOCK expression is used to display the result of multiplication of the 2 numbers.

<html>
<head>
    <title>JSBLOCK Demo: Multiplying 2 numbers</title>
    <script src="bower_components/blocks/dist/blocks.min.js"></script>
</head>
<body>
Number1: <input type=number
                placeholder="Enter a Number"
                data-query="val(number1)"/>
<br/>
Number2: <input type=number
                placeholder="Enter a Number"
                data-query="val(number2)"/>
<h1>Multiplication of {{number1}} and {{number2}} = {{number1 * number2}}</h1>

<script>
    blocks.query({
        number1: blocks.observable(2),
        number2: blocks.observable(3)
    });
</script>
</body>
</html>