How to use Redux with jQuery


How to use Redux with jQuery

Redux is generally used in combination with React, but it’s not tied to React. It is written in vanilla JavaScript which makes it compatible with other libraries such as jQuery, Angular, Backbone, or Cycle.js. This post reviews Redux and its core concepts and then demonstrates how to use it with jQuery. We’ll be creating 2 applications to demonstrate the use of Redux with jQuery. The first application deals with simple string values, the second with an application using an object.

What is Redux?

From the official documentation. Redux is a predictable state container for JavaScript apps. It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger.

Here are some of the features/pros of Redux:

• It replaces the existing state with a new state. This makes data handling a lot safer.
• It supports hot reloading, which in turn makes debugging easy and fast.
• It also supports time travel debugging, which allows you to go backward to a previous point in your state.

Redux Components to use Redux with jQuery

There are 3 major components of any Redux application. These are Actions, Reducer and Store. The below diagram shows the relationship between these components:

Untitled


 

Leave a Reply

Your email address will not be published. Required fields are marked *