Questions tagged [cyclejs]

CycleJS is a fully reactive JavaScript framework for Human-Computer Interaction

Cycle.js: a functional and reactive JavaScript framework for cleaner code.

Your app and the external world as a circuit:

Your app and the external world as a circuit:

Cycle’s core abstraction is that your application is a pure function: main(). A function where inputs are read (sources) from the external world and outputs (sinks) are written to the external world. These side effects in the external world are managed by drivers: plugins that handle DOM effects, HTTP effects, and other side effects.

The internals of main() are built using Reactive programming primitives, which maximize the separation of concerns, providing a clean and fully declarative way of organizing your code. The dataflow is plainly visible, making it easy to read and understand the code.

Read more at cycle.js.org.

117 questions
0
votes
2 answers

Storing REST response to indexedDB with Cycle.js

I'm in the middle of learninig Cycle.JS and ran into a challenge. I have a component that will get a result from an HTTP call and I'd like to persist this response in indexDB. However, I feel that the request for persistence is the responsibility of…
Pete
  • 3,246
  • 4
  • 24
  • 43
0
votes
1 answer

Should cyclejs model actions like Elm/Redux?

I'm playing around with cyclejs and I'm trying to figure out what the idiomatic way to handle many sources/intents is supposed to be. I have a simple cyclejs program below in TypeScript with comments on the most relevant parts. Are you supposed to…
Anthony Naddeo
  • 2,497
  • 25
  • 28
0
votes
2 answers

Cycle.js HTTP response prints as undefined in DOM

I am trying to print the results of an HTTP request to the DOM in Cycle.js. Right now I am just trying to list the results but they will eventually be in a select dropdown. I create the stream... const facilityRequest$ = xs.of({ url:…
kyle
  • 2,563
  • 6
  • 22
  • 37
0
votes
1 answer

Does Cycle.js DOM driver works with JSX for transforms?

I have a very simple transform on top of a DOM source on a cycles piece of code: const tt_dom$ = tt_slider.DOM .map(vn => {vn.sel += '.tt';console.log(9870, vn); return vn}) Now if the component (i.e. tt_slider) specifies the HTML code without…
0
votes
2 answers

Cycle Js - Approach to Synchronizing History with State?

I’m trying to synchronize browser history with state contained within an onionify state store in a very simple cycle js example application. I have no problem mapping from state store to history, the issue is in reducing history.state back into the…
MFave
  • 1,044
  • 2
  • 8
  • 19
0
votes
1 answer

Can there be more than one DOM object in the Cycle.js drivers?

All the Cycle.js examples I've found so far, use a single DOM object, named "DOM", in the drivers argument to run(main, drivers). Is it possible to have more than one object, e.g., one named "DOM1" and another "DOM2"? The purpose of this would be to…
Joe Abbate
  • 1,692
  • 1
  • 13
  • 19
0
votes
1 answer

create cycle js driver

I am relatively new to this framework and am trying to play around creating driver. I understand this code: import {adapt} from '@cycle/run/lib/adapt'; function makeSockDriver(peerId) { let sock = new Sock(peerId); function…
Bads
  • 774
  • 3
  • 8
  • 20
0
votes
1 answer

cyclejs extract target from input text during map operation

Main.ts const clickMessages$ = sources.DOM .select('.add') .events('click'); const latitudeMinimum$ = sources.DOM .select('.latitudeMinimum') .events('input'); const…
patrick
  • 16,091
  • 29
  • 100
  • 164
0
votes
2 answers

how to power two streams from one DOM event

Form has a Save button. When clicked it supposed to route to another component and save form data. But router$ stream consumes the click event leaving socket$ stream without event to act upon. In the code below saveClick$ only works for router$ but…
0
votes
2 answers

CycleJS makeHTTPDriver _add is not a function

Just getting started with CycleJs and I've hit a wall with this error. Basically, I'm running the isomorphic example and adding on HTTP Driver so I can send requests server.js function wrapAppResultWithBoilerplate(appFn, context$, bundle$) { …
Jethro Larson
  • 2,337
  • 1
  • 24
  • 24
0
votes
1 answer

Cyclejs input not resetting after redraw

I tried to create a simple todo app with Cyclejs/xstream. The app works fine. Only thing I not able to understand is after adding each todo the input should clear, which is not happening. todo.js import { div, span, p, input, ul, li, button,…
Soham Dasgupta
  • 5,061
  • 24
  • 79
  • 125
0
votes
1 answer

Converting code from Rxjs to xstream

What will be the equivalent of return Rx.Observable.merge([deleteTodo$, addTodo$, completeTodo$]).startWith([]) .scan(function (currentTodos, modifier) { return modifier(currentTodos); }); the above in rxjs in xstream?
Soham Dasgupta
  • 5,061
  • 24
  • 79
  • 125
0
votes
1 answer

Cyclejs Read/write websocket driver?

I'm new to cyclejs and I'm looking for websocket support and I don't see any (apart from the read only websocket driver from the docs and some 0.1.2 node side npm package). Am I supposed to create my own driver or am I missing something? Thanks in…
Live Nono
  • 3
  • 1
0
votes
1 answer

Passing props to child component Cyclejs

I m studying CycleJs and I m looking for a proper way to handle passing props to child component. Actually, I m having the following stuff : import {div, input} from '@cycle/dom' export function App(sources) { const inputOnChange$ =…
mfrachet
  • 8,772
  • 17
  • 55
  • 110
0
votes
1 answer

Trying to understand tree structure composition in Cycle.js

I am currently learning Cycle.js through reading the official "docs" and any examples I can find. I am still working through some of the core concepts, and in particular have found myself stuck trying to understand how to form a top-level component.…
Justin Bell
  • 396
  • 1
  • 10