O que é Redux? 

Redux é uma biblioteca para armazenamento de estados de aplicações JavaScript.

Nasceu através de uma implementação do Flux, uma arquitetura criada pelo Facebook.

Quando desenvolvemos aplicações utilizando JavaScript, sempre temos que lidar com o gerenciamento de estado.

O Redux veio para suprir essa necessidade de simplificar o controle dos estados de uma aplicação.

Compartilhar estados entre vários componentes diferentes torna- se uma coisa muito fácil quando o utilizamos.

Como utilizar?

Fazendo o uso do Redux todos esses estados ficarão armazenados em uma árvore de objetos através do store. Para que isso aconteça, o Redux utiliza 3 recursos:

• Store: você pode pensar em store como um container ou um grande centro de informações, que tem disponibilidade para receber e entregar o que o seu componente requisita. A store armazena de forma centralizada todos os estados da aplicação. Vale ressaltar que a store é imutável;
• Actions: São ações disparadas da aplicação para o store. Elas são criadas através das action creators. As actions são a única forma de acionar uma mudança de estados no store;
• Reducers: Cada dado da store deve ter o seu próprio reducer. Ele é encarregado de lidar com todas as ações e especificam como o estado da aplicação irá mudar de acordo com a action que foi enviada para o store.

Quais os princípios?

O Redux tem 3 princípios, sendo:

• Todos os estados estarão disponíveis exclusivamente através do store: todo o estado da sua aplicação vai estar armazenado nesse store que é único, onde todos os componentes vão consultar nesse store;
• Os estados são somente leitura: os componentes não podem fazer uma manipulação direta nas informações que estão nele;
• As alterações são feitas através de funções puras: o Redux utiliza o conceito de programação funcional, por isso toda alteração no store é feita através de uma função pura, chamada de reducer. O reducer recebe o estado e a ação, onde com essa ação nós visualizamos o que precisa ser alterado no estado e o reduce entrega uma nova store do nosso estado da aplicação.

Como funciona?

O fluxo geralmente funciona da seguinte forma: um componente gera uma interação através de um clique dado pelo usuário na interface – por exemplo, assim, um action creator é acionado e dispara uma ação para o store.

Essa ação chega até um reducer que irá processar e fazer a alteração do estado no store.

Assim um novo estado será disponibilizado para o componente.

Por fim

Por ser uma biblioteca, o Redux pode até ser utilizado sozinho, mas ele é normalmente implementado em um conjunto de outras libs ou frameworks JavaScript (Ember, Vue, Angular…).

Mas o comum mesmo, que você até já deve ter visto, é vê-lo em funcionamento com o React.

É muito comum ver projetos e exemplos de React com Redux juntos, mas é bom deixar claro que o Redux não depende do React.