---
title: Redux
description: This doc describes Redux extension.
nav: 4.98
keywords: redux
published: false
---

Jotai's state resides in React, but sometimes it would be nice
to interact with the world outside React.

Redux provides a store interface that can be used to store some values
and sync with atoms in Jotai.

### Install

You have to install `redux` and `jotai-redux` to use this feature.

```
npm install redux jotai-redux
```

## atomWithStore

`atomWithStore` creates a new atom with redux store.
It's two-way binding and you can change the value from both ends.

```jsx
import { useAtom } from 'jotai'
import { atomWithStore } from 'jotai-redux'
import { createStore } from 'redux'

const initialState = { count: 0 }
const reducer = (state = initialState, action: { type: 'INC' }) => {
  if (action.type === 'INC') {
    return { ...state, count: state.count + 1 }
  }
  return state
}
const store = createStore(reducer)
const storeAtom = atomWithStore(store)

const Counter = () => {
  const [state, dispatch] = useAtom(storeAtom)

  return (
    <>
      count: {state.count}
      <button onClick={() => dispatch({ type: 'INC' })}>button</button>
    </>
  )
}
```

### Examples

<Stackblitz id="vitejs-vite-qqsnwc" file="src%2FApp.tsx" />
