cans: A framework for building React MobX application

cans: A framework for building #ReactJS #MobX application:  #JavaScript

  • cans: A framework for building React MobX applicationI’ve used MobX for a long time.
  • Every UI component can write as a function of state ((state) = UI), which let you test the UI more easy, just pass different state and expect the return value.Using MobX and React means you get all of it.
  • And then my framework cans came out.What is canscans is a framework for building React MobX application.
  • Note that you can also pass a high order function that return a observable.app.model({ namespace: ‘counter’, observable: app = observable({ /** … **/ })})In this case, you are able to access the app instance, in order to access other models or plugins.viewThe way to react the React component is using mobx-react.
  • The different part is it will be bind in app.plugins, and return not only observable in observable key:ConclusionThe main idea of cans is always to organize your stores.

I’ve used MobX for a long time. It is awesome when I just want a simple state manager for my React application. I always think about how to organize my React MobX application. Because MobX is too…

@ReactiveConf: cans: A framework for building #ReactJS #MobX application: #JavaScript

I’ve used MobX for a long time. It is awesome when I just want a simple state manager for my React application.

I always think about how to organize my React MobX application. Because MobX is too free to write maintainable application (for me).

In my opinion, the best way to building web User Interface is separate the state and the UI. This is what Elm Architecture dose. It separates every elm program into Model, Update and View parts. It’s good. But I am not familiar with functional programming, so do many web UI developers.

), which let you test the UI more easy, just pass different state and expect the return value.

Using MobX and React means you get all of it. MobX will take care of the state, React will take care of the View render. And then my framework cans came out.

cans is a framework for building React MobX application. It learns a lot from serveral framework (choo ,Elm, Egg, dva). It gives you a new way to organize your MobX store (observable).

The main idea of cans is to organize your stores.

Let check out how to build a simple counter application firstly:

This is the simplest way to build a cans application. As you can see, there are some concepts in cans:

Note that you can also pass a high order function that return a observable.

namespace: ‘counter’,

In this case, you are able to access the app instance, in order to access other models or plugins.

to props.

key:

The main idea of cans is always to organize your stores. I want to bring the best practice of MobX-React in this framework in future. And it just a beginning. If you have any ideas, you are welcome to open an issue.

cans: A framework for building React MobX application