Have ideas to improve npm?Join in the discussion! »

    requerio

    0.6.3 • Public • Published

    Redux + jQuery + Cheerio = predictable client-side state + server-side testability

    Known Vulnerabilities Linux Build Status Mac Build Status Windows Build Status Coverage Status License

    While Requerio was named with Cheerio in mind, Cheerio is optional and can be replaced by jQuery on the server via JSDOM, or any other DOM emulator.

    Install:

    npm install requerio redux cheerio
    - or -
    npm install requerio redux jquery jsdom

    Declare $:

    const cheerio = require('cheerio');
    const html = fs.readFileSync('./index.html', 'utf8');
    const $ = global.$ = cheerio.load(html);
    - or -
    const {JSDOM} = require('jsdom');
    const html = fs.readFileSync('./index.html'), 'utf8');
    const {window} = new JSDOM(html);
    global.window = window;
    global.document = window.document;
    const $ = global.$ = require('jquery');
    - or -
    <script src="jquery.min.js"></script>

    Declare Redux:

    const Redux = global.Redux = require('redux');
    - or -
    <script src="redux.min.js"></script>

    Declare Requerio:

    const Requerio = require('requerio');
    - or -
    <script src="requerio.min.js"></script>

    Declare $organisms:

    At declaration, organisms are just empty namespaces.

    const $organisms = {
      '#yoda': null,
      '.midi-chlorian': null
    };

    Instantiate requerio:

    const requerio = new Requerio($, Redux, $organisms);

    Initialize requerio:

    requerio.init();

    Use:

    // During initialization, the null `$organisms['#yoda']` underwent
    // inception into Requerio organism `requerio.$orgs['#yoda']`. This
    // organism has properties, methods, and state. It is home to the
    // `.midi-chlorian` organisms. (A productive biome would want them to
    // be symbionts and not parasites!) To demonstrate that `#yoda` is
    // alive and stateful, let's dispatch a `css` action to give it a
    // `color:green` css property.
    requerio.$orgs['#yoda'].dispatchAction('css', {color: 'green'});
    
    // This action will turn the organism's text green in the browser.
    // We can observe its state after dispatching the action.
    const mainState = requerio.$orgs['#main'].getState();
    
    // In Node, we can test to ensure the action updated the state correctly.
    assert.equal(mainState.css.color, 'green');

    Why Requerio?

    API docs

    Methods supported:

    See also the code examples.

    Install

    npm i requerio

    DownloadsWeekly Downloads

    28

    Version

    0.6.3

    License

    MIT

    Unpacked Size

    393 kB

    Total Files

    19

    Last publish

    Collaborators

    • avatar
    • avatar