React Redux Tutorials - 17 - Store

Create a redux store and provide it to our react application.

src / redux / store.js

import { createStore } from 'redux';
import cakeReducer from './cake/cakeReducer';

const store = createStore(cakeReducer);

export default store

To provide this store to our react application, react-redux library exports a component called Provider.

src / App.js

import React from 'react';

// import the Provider and the store
import { Provider } from 'react-redux';
import store from './redux/store'

import CakeContainer from './components/CakeContainer';

function App() {
  return (
    <Provider store={store}>
    <div className="App">
      <CakeContainer />
    </div>
    </Provider>
  );
}

export default App;

On the Provider component, we can specify a prop called store and pass in the store that we have imported.

Typically, we provide store at the top of the app. App.js