SlimJS TodoMVC

What would you like to do?

SlimJS is for the lazy coder

It's Web Components, on steroids

SlimJS Provides fun and easy-to-use data-binding and injection mechanism for native web-components without the hassle of heavyweight frameworks.

It's not a framework, it's your enemy's enemy

Write your code without any forced code-conventions or patterns from a 3rd party library.

Data-Binding

One-way properties and method bindings using brackets. Every change in "user" property on the parent, will propogate to the bound nodes


        <login-screen>
            <login-form user="[user]"
                        user-details="[getDetails(user)]" />
        </login-screen>
    
    

Text-to-Data-Binding

Inject property values into your text with a simple annotation. Have no fear from performance issues: you choose where and when your bindings happen!


        <my-element user="{UserModel}"}>
            <span bind>
                Hello, [[user.name]]! Welcome to [[location]]
            </span>
        </my-element>
    
    

Dependency Injection

Dependency injection using curly braces


        const instance = new TodoModel()

        SlimInjector.define('LoginModel', function() {
            "use strict";
            return instance
        })

        ...

        <login-details model="{LoginModel}" />
    
    
© 2016 Avichay Eyal. All code provided is open source under the MIT License Fork me on GitHub