--- id: 5a24c314108439a4d4036157 title: Write a Counter with Redux challengeType: 6 isRequired: false videoUrl: '' localeTitle: Escribir un contador con redux --- ## Description
¡Ahora has aprendido todos los principios básicos de Redux! Ha visto cómo crear acciones y creadores de acciones, crear una tienda Redux, enviar sus acciones contra la tienda y diseñar actualizaciones de estado con reductores puros. Incluso ha visto cómo administrar el estado complejo con una composición de reductor y manejar acciones asíncronas. Estos ejemplos son simplistas, pero estos conceptos son los principios básicos de Redux. Si los entiende bien, está listo para comenzar a crear su propia aplicación Redux. Los siguientes desafíos cubren algunos de los detalles relacionados con state inmutabilidad del state , pero primero, aquí hay una revisión de todo lo que has aprendido hasta ahora.
## Instructions
En esta lección, implementará un contador simple con Redux desde cero. Los conceptos básicos se proporcionan en el editor de código, ¡pero tendrás que completar los detalles! Utilice los nombres que se proporcionan y defina los action creators incAction y decAction , los decAction acción counterReducer() , INCREMENT y DECREMENT , y finalmente la store Redux. Una vez que hayas terminado, deberías poder enviar acciones de INCREMENT o DECREMENT para incrementar o disminuir el estado que se tiene en la store . Buena suerte construyendo tu primera aplicación con Redux!
## Tests
```yml tests: - text: La acción creador incAction debe devolver un objeto acción con type igual al valor de INCREMENT testString: 'assert(incAction().type ===INCREMENT, "The action creator incAction should return an action object with type equal to the value of INCREMENT");' - text: La acción creadora decAction debe devolver un objeto de acción con un type igual al valor de DECREMENT testString: 'assert(decAction().type === DECREMENT, "The action creator decAction should return an action object with type equal to the value of DECREMENT");' - text: La tienda Redux debería inicializarse con un state de 0. testString: 'assert(store.getState() === 0, "The Redux store should initialize with a state of 0.");' - text: El envío de incAction en el almacén de Redux debería incrementar el state en 1. testString: 'assert((function() { const initialState = store.getState(); store.dispatch(incAction()); const incState = store.getState(); return initialState + 1 === incState })(), "Dispatching incAction on the Redux store should increment the state by 1.");' - text: El envío de la decAction en el almacén de Redux debería disminuir el state en 1. testString: 'assert((function() { const initialState = store.getState(); store.dispatch(decAction()); const decState = store.getState(); return initialState - 1 === decState })(), "Dispatching decAction on the Redux store should decrement the state by 1.");' - text: counterReducer debe ser una función testString: 'assert(typeof counterReducer === "function", "counterReducer should be a function");' ```
## Challenge Seed
```jsx const INCREMENT = null; // define a constant for increment action types const DECREMENT = null; // define a constant for decrement action types const counterReducer = null; // define the counter reducer which will increment or decrement the state based on the action it receives const incAction = null; // define an action creator for incrementing const decAction = null; // define an action creator for decrementing const store = null; // define the Redux store here, passing in your reducers ```
## Solution
```js // solution required ```