notes

A project to layout global and local state patterns with React and Reactive Streams

The example application used enables the maintenance of a list of widget names. The user is able to view, add, update, and delete widgets on this list. The list holds a maximum of 20 items.

A messaging system is used to notify the user of events and confirm actions.

Main Component outline

<StoreProvider>
  <Widgets>
    <WidgetHeader />
    <WidgetManager>
      <h3>header</h3>
      <WidgetList>
    </WidgetManager>
    <WidgetControl>
      <h3>header</h3>
      <WidgetAdd />
      <WidgetEdit />
    </WidgetControl>
    <WidgetMessage>
  </Widgets>
</StoreProvider>

State

interface WidgetNamesInterface{
  widgetNames: Array,
  lastUpdate: String
}
{widgetNames: [], lastUpdate: ''}

Actions

• Add Widget Name

• Edit Widget Name

• Delete Widget Name

• Show Message