Some Cycle.js FAQ notes I threw together and will try rearrange that might help people using Cycle.js. Some of these are notes copied from the Cycle.js Gitter channel.
Why does Cycle.js code often have $ symbols in variables
The $ convention is used to signify a variable that is an Observable.
Another not so standard idea is to import Observable as another name like $, eg
- How to debug RxJS code
- Adding a
debugger;line to your code can be useful to break into your browser debug mode.
- Logging RxJS (see below)
Logging for RxJS
or a prototype from @milankinen's gist
Cycle.js Templating System
Cycle.js recommends using HyperScript Helpers, which I also prefer. There is also plain HyperScript and the React JSX support.
HyperScript and HyperScript Helpers
Hyperscript plain and Hyperscript helper conversion from HTML http://html-to-hyperscript.paqmind.com/
Redux concept in RxJS:
What is Transposition in Cycle.js
@staltz Transposition is: a child of a vdom element can be an
Observable<VElement> and at the end it will be flattened as one "video".
Combinators in this article are the same concept.
Isolate, Children and Events
A really cool example by @laszlokorte on how events and isolation work with surrounding discussion on the TSERS Gitter channel.
click2$ will see the event that happens when the user clicks button.foo
Input Forms in Cycle.js
Here are some example repos with ideas on how to make input forms:
How go listen for keypress events on the whole app
Normally you listen to global keypresses with a driver as @TylorS explains here:
The reason DOM.select() doesn't select from document, is because it's external to your main(). Drivers are the place where you listen to what is external to your main().