In search of the perfect css framework. Maxmertkit widget manager


    The previous post describing the maxmertkit framework received a great response. For some reason, the framework was especially liked by the Japanese, but I received the best constructive criticism and help from the habrasociety. Now to the point.
    Current frameworks, including mine, have a modular structure. But all these modules are to some extent dependent on each other. This is bad. This is the problem I want to solve.

    I will give an example.
    Suppose I have a button widget . It is part of the widget group . I can use the button both separately and as part of a group. But what if I change the button at my discretion? Then, as part of the group, it will also change, but I want it to look in the group as before.
    Unfortunately, there is no good solution to this problem yet. So I started my second project, which will solve this problem: mwm (maxmertkit widget manager).

    Inspired by the idea of ​​npm, I already made the manager myself (I will post later with an explanation article), and now I am developing a portal with widgets and themes.

    What technologies are used?

    • nodejs is used by the manager for file manipulation, server requests and sass compilation.
    • npm to install manager.
    • sass to compile css.
    • Mwm itself is written using coffeescript.


    How will it work?

    For example, to install the widget button (in the html-code you will need to use a class .-btn)

    mwm install btn
    

    After that, the manager downloads this widget, compiles your framework, and writes the result to a css file. All you have to do is use it!
    If you need a widget with specific themes (which you found on the portal), then

    mwm install group -t error warning
    

    Now you can use themes for this widget:


    What about the dependency of the group widget on the btn widget ? As in nodejs, they are independent of each other. This is made possible thanks to the SASS code that is generated using nodejs and placed in the dependency folder of a particular widget. You can change the btn widget , it will not be modified inside the group .

    As before in maxmertkit, any theme will be applicable to any widget, but you can specifically specify which theme you want to use with which widget. This reduces the amount of css code.

    Publication

    You will be able to publish widgets in the same way as in npm.

    A little more automation

    Like npm, maxmertkit widget manager has a maxmertkit.json file that describes your css framework and its dependencies. That is, finding a new version of a css widget on the portal, you change its version in maxmertkit.json and execute

    mwm update
    

    In the same way, you can change the themes that your widget uses.

    I wanted to lay out the manager himself now, but it is useless without a portal, so I will publish everything at once. Dates? I plan in two months. So far I have organized a fundraiser, the money from which will go to pay for the server, where the maxmertkit portal with widgets, themes and modifiers will be deployed - https://www.bountysource.com/#fundraisers/85 .
    Thanks for the feedback regarding maxmertkit, I am very grateful to you!

    Website - http://maxmert.com/
    Github - https://github.com/maxmert/maxmertkit

    Also popular now: