Skip to content

Commit 00224c4

Browse files
committed
Fix filenames
1 parent 181a54a commit 00224c4

File tree

1 file changed

+5
-5
lines changed

1 file changed

+5
-5
lines changed

docs/tutorials/quick-start.mdx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ npm install @reduxjs/toolkit react-redux
4949

5050
Create a file named `src/app/store.js`. Import the `configureStore` API from Redux Toolkit. We'll start by creating an empty Redux store, and exporting it:
5151

52-
```ts title="app/store.ts"
52+
```ts title="app/store.js"
5353
import { configureStore } from '@reduxjs/toolkit'
5454

5555
export const store = configureStore({
@@ -68,7 +68,7 @@ This creates a Redux store, and also automatically configure the Redux DevTools
6868
6969
Once the store is created, we can make it available to our React components by putting a React-Redux `<Provider>` around our application in `src/index.js`. Import the Redux store we just created, put a `<Provider>` around your `<App>`, and pass the store as a prop:
7070
71-
```ts title="index.tsx"
71+
```ts title="index.js"
7272
// file: App.tsx noEmit
7373
import React from 'react'
7474
export default function App() {
@@ -109,7 +109,7 @@ Creating a slice requires a string name to identify the slice, an initial state
109109

110110
Redux requires that [we write all state updates immutably, by making copies of data and updating the copies](https://redux.js.org/tutorials/fundamentals/part-2-concepts-data-flow#immutability). However, Redux Toolkit's `createSlice` and `createReducer` APIs use [Immer](https://immerjs.github.io/immer/) inside to allow us to [write "mutating" update logic that becomes correct immutable updates](https://redux.js.org/tutorials/fundamentals/part-8-modern-redux#immutable-updates-with-immer).
111111

112-
```ts title="features/counter/counterSlice.ts"
112+
```ts title="features/counter/counterSlice.js"
113113
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
114114

115115
interface CounterState {
@@ -150,7 +150,7 @@ export default counterSlice.reducer
150150

151151
Next, we need to import the reducer function from the counter slice and add it to our store. By defining a field inside the `reducers` parameter, we tell the store to use this slice reducer function to handle all updates to that state.
152152

153-
```ts title="app/store.ts"
153+
```ts title="app/store.js"
154154
// file: features/counter/counterSlice.ts noEmit
155155
import { createSlice } from '@reduxjs/toolkit'
156156

@@ -179,7 +179,7 @@ export default configureStore({
179179

180180
Now we can use the React-Redux hooks to let React components interact with the Redux store. We can read data from the store with `useSelector`, and dispatch actions using `useDispatch`. Create a `src/features/counter/Counter.js` file with a `<Counter>` component inside, then import that component into `App.js` and render it inside of `<App>`.
181181

182-
```ts title="features/counter/Counter.tsx"
182+
```ts title="features/counter/Counter.js"
183183
// file: features/counter/counterSlice.ts noEmit
184184
import { createSlice } from '@reduxjs/toolkit'
185185
const counterSlice = createSlice({

0 commit comments

Comments
 (0)