The PubNub Redux Framework provides interfaces for front-end view components to connect to the PubNub service through a predictable state-management layer. This reference section shows you how to set up the PubNub Redux Framework for use in your application.
The instructions on this page assume that you will be building your application using the React framework. If you are using a different framework, the framework setup must generate the required
package.json file before you can install the Redux package.
Initialize a new React app
Start by initializing a React application that supports TypeScript.
Create a new React app in the
npx create-react-app team-chat --typescript
Enter the directory for your React app and run the setup script.
cd team-chat npm install
Install Redux into your project folder. Redux installs its own TypeScript definitions.
Install support for the Redux application framework.
npm install redux
Install the Redux Thunk middleware to support asynchronous requests.
npm install redux-thunk
Install support for Redux-compatible React components.
npm install react-redux
Install PubNub SDKs
To install the SDKs and required libraries, do the following:
npm install pubnub npm install @types/pubnub
Install the PubNub Redux Framework. It installs its own TypeScript definitions.
npm install pubnub-redux
Test the Setup
After you have installed the Redux and PubNub Redux libraries in your project, run the following command to open a web browser to view the React app:
If you see the following screenshot, then congratulations! Your app is ready.
If you don't see the screenshot, then an error occurred while installing the Redux and PubNub Redux libraries. Delete the app folder and follow these steps again. If you still experience errors, contact PubNub Support.
Now that you have a basic React app connected to the Redux Framework, you can continue to build your app, supported by the predictable state-management power of Redux!