doz

A JavaScript framework for building UI, almost like writing in VanillaJS.



Documentation | Demo

Tiny size: 7KB (gzip)

Why another framework?

In the web there are many frameworks that do all the same things. But a lot of them are complex, we need to know a lot of directives and they make confusion for example with the context of "this", some introduce other syntaxes like JSX. All you need is HTML, CSS and Doz.

Installation

npm install --save doz

Example

<div id="app"></div>

Component definition

Doz.component('button-counter', {
    props: {
        counter: 0
    },
    template: function() {
        return `
            <div>
                <button onclick="this.click()">${this.props.title}</button>
                <span class="counter">${this.props.counter}</span>
            </div>
        `
    },
    click: function() {
        this.props.counter += 1;
    }
});

Make a view with the component defined above

new Doz({
    root: '#app',
    template: `
        <button-counter title="Click me!"></button-counter>
    `
});

CDN unpkg

<script src="https://unpkg.com/doz/dist/doz.min.js"></script>

Changelog

You can view the changelog here

License

DOZ is open-sourced software licensed under the MIT license

Author

Fabio Ricali

Changelog

[0.0.23] - 2018-05-13

• Added support to SVG element
• Fixed issue when inside the template there are no tag element like comment for example