Baconjs with MobX and React

[Andrzej Porebski]

Has anyone used this stack in their project? If so, can you share you experiences ?

Are there are resources/tutorials/samples on the web about this particular stack? I have googled but nothing is coming up.

I am trying to figure out how to use MobX with Baconjs...

[Juha Paananen]

Hmmm MobX never heard, must study... is there something in particular that's hard to make interact with Bacon? React with Bacon is my current workhorse.

[Ville Lautanala]

MobX-utils would allow interoperability via ES2017 Observables. I should refresh #634 to enable support.

[Juha Paananen]

Had a look at MobX. Seems interesting, though a bit magic-ish for my taste :)

Anyway, enabling ES2017 Observables support looks like the way to go. Why didn't we finish that one earlier on? Maybe just forgotten and abandoned because of lack of interest.

[Andrzej Porebski]

I have seen a MobxRxjs bridge - it looks way cool. I thought that maybe it would be an interesting project to make Bacon work seamlessly with mobX observables.

I agree that MobX looks a bit too magical but I have experimented a little bit and it really does rock.
One piece that I like a lot is the fact the the observable can be manipulated just like an ordinary JS variable and yet you get all change notifications in a deterministic fashion. The other aspect of mobx I liked were transactions inside actions. And of course automatic binding to React Components.

What would be cool is that if I could somehow use Bacon.createTemplate or Bacon.update on mobx observables. I have set up my on demand data loading to be based strictly on the app state model where individual pieces are now Bacon Properties. Cannot reproduce this using mobX observables...

[Juha Paananen]

Now that lautis has refreshed #649, would you @andpor care to check if the bacon.js version in the es-observable branch works for this purpose? Here's the Bacon.js binary distribution build for that branch: https://github.com/baconjs/bacon.js/tree/es-observable/dist

[Ville Lautanala]

The RxJS-MobX bridge seems to be deprecated in favour of the mobx-utils linked earlier. With that, it should be possible (using the es-observable branch) to do the following:

import mobxUtils from 'mobx-utils'
import mobx from 'mobx'
import Bacon from 'baconjs'
const user = mobx.observable({
  firstName: "C.S",
  lastName: "Lewis"
})

Bacon.fromESObservable(mobxUtils.toString(() => user.firstname + user.lastname).onValue((userName) => /* do something */(

and

import mobxUtils from 'mobx-utils'
import Bacon from 'baconjs'
const observable = new Bacon.Bus()
mobxUtils.fromStream(observable[Symbol.observable])

MobX observables would have a concept of initial values like Bacon properties, but that is lost in the process.

I haven't run the code above, it's based on paraphrasing the documentation and tests for mobs-utils.

[Andrzej Porebski]

@raimohanska - i will take a look later tonight. Thanks!