Copy this bookmark:



description:


tags:



bookmark detail

vuedeux: Binding Solutions for Vue & Redux
Github repo
Name: vuedeux
Tagline: Binding Solutions for Vue & Redux
Homepage: http://vuedeux.com
Languages:
JavaScript = 2376 bytes

[![NPM](https://nodei.co/npm/vuedeux.png?compact=true)](https://npmjs.org/package/vuedeux)

# vuedeux

![Alt Text](https://github.com/dmrx/vuedoo/raw/master/examples/TodoMVC/assets/vuedeuxsmall.png)

## Full Documentation
https://vueduex.gitbooks.io/vuedeux-documentation/content/

## Synopsis

Vuedeux is a lightweight open-source utility layer for binding Vuex to Redux in a way that allows developers to re-use their pre-existing Redux stores.

## Motivation
Vuedeux answers our team's desire to create a simple way to re-use and share state-management code with Vue/Vuex. The decision to create the Vuedeux compatibility layer between Vuex and Redux was inspired by the idea of uniting the quickly growing Vue community and Redux's broad user-base and ecosystem.

We love Vue & Vuex. We love the elegance and the tight integration. We love Redux. We love that it is framework agnostic and has a robust ecosystem of tools, middlewares, and bindings.

We wanted to make them work together in a developer-friendly and highly customizable way to encourage interoperability and streamline reusability of code bases.

Vuedeux allows Redux developers to feel at home in Vue while providing all the conveniences and efficiencies of Vuex.

## How It Works
The Vuedeux Plugin Creator takes your Redux action types and Redux store, and then maps your Redux state and all associated actions to a Vuex module with equivalent actions and mutations, allowing you to easily reuse your existing Redux state store and dispatch to Vuex just like you would with Redux.

## Prerequisites
Redux, Vue, Vuex

## FIRING UP A SIMPLE VUEDEUX EXAMPLE - TODO MVC
Fork and clone down a copy of this repository, and navigate to the directory within your terminal.

To download and install all dependencies

run:
```
npm install
```

Start up the dev server
```
npm start
```

You should now be able to navigate to http://localhost:8080/ to demo the app.

The architecture of this classic TODO MVC app can be found in the examples folder and offers a simple example of the Vuedeux data flow from Vuex to Redux and back.

## Installation
```
npm install vuedeux
```
## Getting Started
In this section we will be breaking down how to get started with the Vuedeux Plugin Creator.

The Vuedeux plugin initiates a Vuex module and maps all actions between the newly created Vuex module and Redux. It also keeps our Redux store and our Vuex 'Vuedeux' module in sync.

### Importing the dependencies
```
import vdxPluginCreator from 'vuedeux';
import reduxStore from './reduxstore';
import * as reduxActionTypes from './actions/reduxactiontypes';
```
The dependencies for the Vuedeux plugin are:
* Vuedeux package
* Your Redux store
* Your Action Type CONSTANTS

It is common convention in Flux and Redux to identify your Action Types using Constants and group them together in their own file (as seen below) . Vuedeux relies on this convention in order to accurately map your Redux Action types to Vuex actions and mutations.

The PluginCreators expects your Action Type Constants in an object.
```
import * as reduxActionTypes from './actions/reduxactiontypes';
```
The following Node import statement is an easy way for you to create an action type object from your...
github  programming  github-starred-to-pinboard  crypto 
february 2018 by brianyang
view in context