Nervously Proposing Marriage

    wechaty-redux
    TypeScript icon, indicating that this package has built-in type declarations

    1.20.2 • Public • Published

    wechaty-redux

    NPM Version NPM Ducksify Extension Powered by Ducks ES Modules

    Wrap Wechaty with Redux Actions & Reducers for Easy State Management

    Wechaty Redux

    Image Source: Managing your React state with Redux

    Downloads TypeScript

    What is Redux

    Redux is a Predictable State Container for JS Apps

    Why use Redux with Wechaty

    To be write...

    What is Ducks

    Ducksify Extension

    See Ducks

    Usage

    Install

    npm install wechaty-redux

    Vanilla Redux with Wechaty Redux Plugin

    Vanilla Redux means using plain Redux without any additional libraries like Ducks.

    import {
      createStore,
      applyMiddleware,
    }                         from 'redux'
    import {
      createEpicMiddleware,
      combineEpics,
    }                         from 'redux-observable'
    import { WechatyBuilder }  from 'wechaty'
    import {
      WechatyRedux,
      Api,
    }                         from 'wechaty-redux'
    
    /**
     * 1. Configure Store with RxJS Epic Middleware for Wechaty Ducks API
     */
    const epicMiddleware = createEpicMiddleware()
    
    const store = createStore(
      Api.default,
      applyMiddleware(epicMiddleware),
    )
    
    const rootEpic = combineEpics(...Object.values(Api.epics))
    epicMiddleware.run(rootEpic)
    
    /**
     * 2. Instanciate Wechaty and Install Redux Plugin
     */
    const bot = WechatyBuilder.build({ puppet: 'wechaty-puppet-mock' })
    bot.use(WechatyRedux({ store }))
    
    /**
     * 3. Using Redux Store with Wechaty Ducks API!
     */
    store.subscribe(() => console.info(store.getState()))
    
    store.dispatch(Api.actions.ding(bot.puppet.id, 'dispatch a ding action'))
    // The above code 👆 is exactly do the same thing with the following code 👇 :
    Api.operations.ding(store.dispatch)(bot.puppet.id, 'call ding from operations')

    Ducks Proposal Style for Wechaty Redux Plugin

    import { WechatyBuilder } from 'wechaty'
    import { Ducks }          from 'ducks'
    import {
      WechatyRedux,
      Api,
    }                   from 'wechaty-redux'
    
    /**
     * 1. Ducksify Wechaty Redux API
     */
    const ducks = new Ducks({ wechaty: Api })
    const store = ducks.configureStore()
    
    /**
     * 2. Instanciate Wechaty with Redux Plugin
     */
    const bot = WechatyBuilder.build({ puppet: 'wechaty-puppet-mock' })
    bot.use(WechatyRedux({ store }))
    
    /**
     * 3. Using Redux Store with Wechaty Ducks API!
     *  (With the Power of Ducks / Ducksify)
     */
    const wechatyDuck = ducks.ducksify('wechaty')
    
    store.subscribe(() => console.info(store.getState()))
    wechatyDuck.operations.ding(bot.puppet.id, 'Ducksify Style ding!')

    Redux Actions

    See: api/actions.ts

    Redux Operations

    See: api/operations.ts

    Ducks Api

    Ducksify Extension

    See: api/index.ts

    API Docs

    Links

    CQRS

    1. Command–query separation

    Chatbot in Redux

    1. Building bots with Redux
    2. BotBuilder v3 Node.js bot with Redux state management
    3. 🐺 Declarative development for state driven dynamic prompt flow
    4. Botbuilder Redux Middleware
    5. Botbuilder Redux Common Package

    Redux Tools

    1. Redux DevTools
    2. Remote Redux DevTools
    3. Using Redux DevTools in production
    4. Video - Getting Started with Redux Dev Tools

    Redux Talks

    Redux Middleware

    Redux Enhancers

    Articles

    1. Setting Up a Redux Project With Create-React-App
    2. Redux is half of a pattern

    Useful Modules

    1. redux-automata - Finite state automaton for Redux.

    History

    main

    v1.20 (Mar 7, 2022)

    1. Refactoring all events with breaking changes for better CQRS Wechaty support.
    2. Refactoring the events name convension: from eventName to EVENT_NAME

    v1.0 (Oct 28, 2021)

    Release v1.0 of Wechaty Redux (thanks @mukaiu)

    v0.5

    1. Upgrade RxJS version from 6 to 7.1
    2. ES Modules support

    v0.2 (Jun 2, 2020)

    Initial version. Requires wechaty@0.40 or above versions.

    1. WechatyRedux Plugin is ready to use.
    2. API follows the Ducks specification.

    v0.0.1 (Apr 19, 2020)

    Decide to build a Redux Plugin for Wechaty.

    Related Projects:

    1. A library that exposes matrix-js-sdk state via Redux
    2. A library for managing network state in Redux
    3. How to setup Redux for a REST api
    4. Redux middleware for calling an API

    Author

    Huan LI (李卓桓) zixia@zixia.net

    Profile of Huan LI (李卓桓) on StackOverflow

    Copyright & License

    • Code & Docs © 2020 Huan (李卓桓) <zixia@zixia.net>
    • Code released under the Apache-2.0 License
    • Docs released under Creative Commons

    Install

    npm i wechaty-redux

    DownloadsWeekly Downloads

    372

    Version

    1.20.2

    License

    Apache-2.0

    Unpacked Size

    1.23 MB

    Total Files

    234

    Last publish

    Collaborators

    • zixia