globus

    0.1.3 • Public • Published

    Globus

    Functional reactive JavaScript front-end architecture


    Globus is an opinionated but loosely coupled reactive front-end architecture. It is a combination of the following:

    Globus is not really well documented yet, but there is API documentation on the individual projects, and i am planning to make an example application.

    Example app

    import { createApp } from "globus";
     
    const reducers = {
      counter: {
        // initial counter state
        initial: {value: 0},
     
        increment: (state, addend) =>
          state.set("value", state.get("value") + addend || 1)
      }
    };
     
    function View($, _) {
      return div(".hello",
        h1("Mandatory counter app"),
        button(
          {
            // Dispatch counter increment action on click
            $click: () => $.counter.increment(1)
          },
          // Show the current value of the counter
          "Value: " + _.counter.value)
      );
    }
     
    document.addEventListener("DOMContentLoaded", function() {
      createApp(reducers, View);
    });

    Suggested folder structure

    my-application/
      reducers/
      views/
      actions/
      lib/
        transport/
        data/
        validation/
    

    Larger applications may introduce an additional domain level:

    my-application/
      core/
        reducers/
        views/
        actions/
        lib/
          transport/
          data/
      users/
        reducers/
        views/
        actions/
        lib/
          validation/
    
    • reducers is for describing state changes only. no other side effects.
    • actions contain functions that may invoke reducersm while doing other io, like calling backend actions etc
    • views contain view templates, and possibly helper functions
    • lib contains helper functions, as well as stuff like
    • lib/transport data adapters for server communtication, converters,
    • lib/data functions dealing with internal data formats, like resource representations, and
    • lib/validation validator functions

    Install

    npm i globus

    DownloadsWeekly Downloads

    1

    Version

    0.1.3

    License

    MIT

    Last publish

    Collaborators

    • josteinbe