Creating User Interface

Explore how to create a basic user interface that interacts with Redux state. Learn to use jQuery to display and update a recipe list from the Redux store, subscribe to state changes, and dispatch actions to manage UI updates.

We'll cover the following...

To give you an idea of how a basic UI can connect to Redux, we will use a bit of jQuery magic.

Note: this example is very simple and should never be used in a real application.

Let’s store our current UI in ui.js. The jQuery UI will create a simple view of the current recipes in the store:

import $ from 'jquery';
import store from

...

1.Introduction to Redux

2.Basic Redux Implementation

3.Cloning a Redux Boilerplate

4.Complete Redux Project

5.Creating a Store

6.Decorating the Store

7.Actions and Action Creators

8.Redux Thunk

9.Redux-Actions Library

10.Reducers

11.Avoiding Mutations

12.Introduction to Middleware

13.Your First Middleware

14.Middleware

15.State Management

16.Keeping a Normalized State

17.Persistence State

18.Real-World State

19.Server Communication

20.Moving Code from Action Creators

21.Error Handling

22.Server Communication II

23.Transforming Data

24.Chaining Requests

25.Managing Side Effects

26.Messaging Patterns

27.WebSockets

28.WebSocket Authentication

29.Testing

30.Testing Action Creators

31.Async Action Creators

32.Testing Reducers

33.Testing Middleware

34.Testing Async Middleware

35.Integration Tests

36.Evolution Of Redux

Assessment

Creating User Interface