Redux toolkit Part 3

How to configure redux store with saga using redux toolkit

1. install saga

npm install redux-saga or yarn

2.configure saga

3.configure store

import AsyncStorage from ‘@react-native-async-storage/async-storage’;

import rootReducers from ‘app/store/slice’;

import { configureStore } from ‘@reduxjs/toolkit’;

import React from ‘react’

import { Provider, useSelector } from ‘react-redux’;

import { PersistGate } from ‘redux-persist/es/integration/react’;

import {ActivityIndicator, View} from ‘react-native’

const config = {

key: ‘root’,

storage: AsyncStorage,

blacklist: [‘loading’],

debug: true, //to get useful logging

};

import { persistStore, persistReducer } from ‘redux-persist’;

import sagas from ‘app/store/sagas’;

import createSagaMiddleware from ‘redux-saga’;

const middleware = [];

const sagaMiddleware = createSagaMiddleware();

middleware.push(sagaMiddleware);

const reducers = persistReducer(config, rootReducers);

const enhancers = […middleware];

const persistConfig: any = { enhancers };

export const store = configureStore({

reducer: reducers,

middleware: enhancers,

});

sagaMiddleware.run(sagas);

export const persistor = persistStore(store, persistConfig);

export default function index() {

return (

<Provider store={store}>

<PersistGate loading={<ActivityIndicator />} persistor={persistor}>

<View >

</View>

</PersistGate>

</Provider>

)

}

1.click here for configure store from scratch using redux toolkit
2.click here for configure persist store using redux toolkit
3.click here for configure middleware using redux toolkit
4.click here for configure redux-logger using redux toolkit

--

--

--

Software Engineer (React/React Native Developer)

Love podcasts or audiobooks? Learn on the go with our new app.

Why I’m using NextJs on my current project

Using the Spread Operator (…) in JavaScript

Building a CLI With Node.js

Building a CLI with Node.js

Build performance reports for your Apollo React Components in 30 minutes. ⏲️

Sending text to fields for which no known locators.

3 incredibly useful Node.js packages that you should try

Your mega project: https://github.com/strapi/strapi-examples/tree/master/good-old-react-authenticati

Eliminating Next.js ISR Builds with Client Side Rendering

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ahtisham Shahzad

Ahtisham Shahzad

Software Engineer (React/React Native Developer)

More from Medium

Redux vs ReduxToolKit — Simplify Redux Application

Redux is a right tool for your next project?

Redux Toolkit

Redux working system