Chekhov

Chekhov Js Framework

Note

let values =
    {
        all_kinds_of_data_you_need: all_the_values_you_need
    }

then it's time to make a

new Chekhov()

like this

    let ch = new Chekhov({
        reactive: {
        // That's an example of a computed property
            msg: function () {
                if (values.name == "")
                    return "What's your name?"
                else
                    return `Bye ${values.name}! It was Great to meet you!`
            }
        }
    }, values)

due to simpilcity of the framework it requires you to do a few things manually

but it still provides some handy shortcuts

    <div ch-for linked="array" trigger="_iterator">
        <h1 class="central" ch-bind>{{iterator}}</h1>
    </div>

for repeating something a few times but it requires setting up a computed property, that's pretty easy though

            _iterator: function (i) {
                return values.array[i]
            }

There's also ch-if

<li ch-if linked="value">To display or not to display 💀</li>

<button ch-model trigger="click" linked="switch">Continue</button>

to call the linked method when the trigger event happens

A little more

        <input ch-model linked="name" dep="msg" trigger="input"/>

is used for calling the linked method when the trigger event happens

Most important one

Behold

 <h1 ch-bind>{{some_value}}</h1>

which binds the inner value of the element to the property or a value contained in ch.data (e.g. ch.data.msg)