Polishing up the explanation

[dmitriz]

I have been looking through the introduction to the output and it is still looks less clear than I'd like it to be. It is really a unique thing of this library and can easily scare away people if not made as simple as possible, or even simpler :)

Unfortunately, React didn't help making its components less confusing. There are component classes or constructors and there are instances. That look exactly the same in JSX, but who uses JSX anyway? :)

We don't have the JSX problem here, but it might be still more clear to emphasise the difference:

const componentInstance = myComponent({foo: "bar", something: 12}),
const view = div([
  componentInstance,
  componentInstance,
]);

Each line is a declaration of a piece of the state.

Not sure I understand this one ;) The state is a vague concept - is any variable part of the state? Or only the arguments of the view?

HTML-elements

Are they special component instances? Like in React?

The above covers the input to the counter view. We now need to get output from it. All components in Turbine can produce output. Components are represented by a generic type Component<A>. The A represents the output of the component.

I would like to demystify "produce output" here. So the component instance is wrapping its output. Is it possible to extract it directly? Or is it impure?

The output object given to the button functions tells them what output to produce.

button({ output: { incrementClick: "click" } }, "+"),

So does it mean that only this output is produced? So the whole output object is stored as { incrementClick: clickStream }?

  const {inputValue: email} = yield input();

This one is also a bit tricky, would it be possible to break down? What does the yield do here? E.g. in comparison with something like that:

  const {inputValue: email} = yield {inputValue: `[email protected]`}

So these are some questions a reader might come up with, I've thought to put them for the record. :)