# freeCodeCamp Challenge Guide: Register a Store Listener

**URL:** <https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-register-a-store-listener/301446>\
**Category:** freeCodeCamp Contributors\
**Tags:** guide\
**Created:** [August 3, 2019, 1:02pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-register-a-store-listener/301446 "2019-08-03T13:02:25Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![camperbot](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/camperbot/32/18364_2.png) [@camperbot](https://forum.freecodecamp.org/u/camperbot)\
**Post date:** [August 3, 2019, 1:02pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-register-a-store-listener/301446/1 "2019-08-03T13:02:26Z")

</div>

# [Register a Store Listener](https://www.freecodecamp.org/learn/front-end-libraries/redux/register-a-store-listener)

* * *

## Problem Explanation

Let’s break the instructions down to figure exactly what it’s asking.

> _Write a callback function that increments the global variable count every time the store receives an action, and pass this function in to the store.subscribe() method._

We can summarize these steps into small chunks:

1. write a callback function
2. increment the global variable count
3. pass function to `store.subscribe()` method.

Awesome! Now let’s review some of the basics again.

**What is a “callback function” in plain English?**  
A callback function is simply a function that gets called after another function is done being executed. In the real-world, it might be something like this:

```javascript
// You drop your car off at the mechanic and you want the shop to 'call you back' when your car is fixed.
let carIsBroken = true;
const callCarOwner = () => console.log("Hello your car is done!");
const fixCar = (carIsBroken, callCarOwner) => {
  if (carIsBroken === true) {
    carIsBroken = false;
  }
  console.log(carIsBroken);
  // After the car is fixed, the last thing we do is call the car owner - that's our 'callback function'.
  callCarOwner();
};
fixCar(carIsBroken, callCarOwner);

```

**How do you increase a number variable?**  
We can do this by using the “+=” operator.

```javascript
let count = 1;
const addOne = () => (count += 1);

```

### How do you pass a function to a method?

We can pass a function to a method the same way we might pass a variable to a method. Just pass it in as an argument!

```javascript
function sayHi() {
  console.log("Hi!");
}
store.subscribe(sayHi);

```

## Solutions

> **Solution 1 (Click to Show/Hide)**
>
> Using a function definition for the callback.
> 
> ```auto
> const ADD = 'ADD';
> 
> const reducer = (state = 0, action) => {
> switch(action.type) {
> case ADD:
> return state + 1;
> default:
> return state;
> }
> };
> 
> const store = Redux.createStore(reducer);
> 
> // Global count variable:
> let count = 0;
> 
> // Change code below this line
> 
> const add = () => count++;
> store.subscribe(add);
> 
> // Change code above this line
> 
> store.dispatch({type: ADD});
> console.log(count);
> store.dispatch({type: ADD});
> console.log(count);
> store.dispatch({type: ADD});
> console.log(count);
> 
> ```

> **Solution 2 (Click to Show/Hide)**
>
> Using an anonymous inline callback function.
> 
> ```auto
> const ADD = 'ADD';
> 
> const reducer = (state = 0, action) => {
> switch(action.type) {
> case ADD:
> return state + 1;
> default:
> return state;
> }
> };
> 
> const store = Redux.createStore(reducer);
> 
> // Global count variable:
> let count = 0;
> 
> // Change code below this line
> 
> store.subscribe(() => count++);
> 
> // Change code above this line
> 
> store.dispatch({type: ADD});
> console.log(count);
> store.dispatch({type: ADD});
> console.log(count);
> store.dispatch({type: ADD});
> console.log(count);
> 
> ```

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 8, 2025, 3:58pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-register-a-store-listener/301446/2 "2025-01-08T15:58:14Z")

</div>