There are 4 focus points for this release:
Watch this video to get an introduction of the new release:
One of the big highlights here is that all the addons are now removed. The reason is two part. One being a maintenance burden, but also that providers can very easily be built exactly how you want them to work. An example being the router, which this guide shows you how to set up.
Please use the following demos for reference on how to write the new Cerebral code:
Your application should work “out of the box” with the new version with a couple of exceptions. Please look at the migration for what breaks your current app and what gives deprecation warnings:
There is a new signature Compute
, please read more about it here
// REMOVED
import { StateContainer } from '@cerebral/_view_'
// INSTEAD
import App from 'cerebral'
import { Container } from '@cerebral/_view_'
import main from 'path/to/main/module'
const app = App(main)
<Container app={app}>
</Container>
// DEPRECATED
import { Controller } from 'cerebral'
const controller = Controller(...)
// NEW
import App from 'cerebral'
const app = App(...)
// DEPRECATED
import { UniversalController } from 'cerebral'
const controller = UniversalController(...)
// NEW
import { UniversalApp } from 'cerebral'
const app = UniversalApp(...)
Same for the other views as well.
// DEPRECATED
import { Container } from '@cerebral/react'
render(
<Container controller={controller}>
</Container>
)
// NEW
import { Container } from '@cerebral/react'
render(
<Container app={app}>
</Container>
)
// DEPRECATED
import { Module } from 'cerebral'
export default Module({})
export default Module(() => {})
// NEW
export default {}
export default () => {}
If you are using Typescript:
import { ModuleDefinition } from 'cerebral'
const module: ModuleDefinition = {}
export default module
// DEPRECATED
import { signal, signals, module } from 'cerebral/tags'
// NEW
import { sequences, moduleState } from 'cerebral'
Note that sequences grabs a single sequence or module with sequences, so both the previous functionalities of signal and signals.
// DEPRECATED
import * as tags from 'cerebral/tags'
// NEW
import {
string,
props,
state,
sequences,
moduleState,
moduleSequences
} from 'cerebral'
We changed the name of “operators” to “factories”, as that is what they really are.
// DEPRECATED
import { set, push, merge } from 'cerebral/operators'
// NEW
import { set, push, merge } from 'cerebral/factories'
So we are removing addons from the monorepo in the next major version. This will lift a huge maintenance burder off of Cerebral. Instead we will focus on helping you build your own providers and encourage sharing your providers from your own Github repos.
Forms can be treated as “complex inputs”. That means instead of controlling the whole form from within the state store, you rather let the form handle itself and the state store can hook into it. formsy-react is one such solution, though there are many others.
You can use any http library out there, just expose the methods your are using on a provider. Look at this guide.
You can choose component based routing, any routing the framework exposes or you can choose a “Cerebral first” routing solution as seen in this guide.
Local storage is very straight forward to expose through a provider, though you might want something more powerful to expose and that is when you have solutions like local-storage.
Firebase was one of the more comprehensive addons and it was developed early on when Google took over Firebase. Their API has gotten a lot of love and it is easy to now expose methods from the Firebase API as a provider and manage it that way.