Unable to use deconstructors on Codepen

Hey, i’m in the process of learning react + redux, i made a project on my machine and it’s working fine here, however when trying to upload the project to codepen, it breaks. I can’t use deconstructors apparently.

Here is the github project: https://github.com/GregoryGoncalves/freecodecamp/tree/master/frontend-frameworks/quote-machine/src

Here is the codepen: https://codepen.io/Selhar/pen/GWEwWx?editors=0010

Here is another react + redux codepen, using deconstructors: https://codepen.io/iamscottcox/pen/jVMzJR?editors=0010

Any help would be appreciated, i may be fatigued but it seems like we’re using the same libraries and doing very similar use of deconstructor. I tried to add Lodash like his project has, nothing changed though, so i removed it.

EDIT: for now i’m using the minified version, not worth the trouble of re-structuring every project only for codepen.

It looks like the version of babel that codepen is using does not include anything beyond ES6. The object spread operator is included in the babel stage-2 preset, but I don’t think you can include that on codepen.

An alternative is to use Object.assign().

Instead of:

                ...state,
                quote: "This API's free access has an upper limit of 100 requests/day, it exceeded",
                author: "broke ass dev"
            }```

you could do:
```            return Object.assign({}, state, {
                quote: "This API's free access has an upper limit of 100 requests/day, it exceeded",
                author: "broke ass dev"
            })```
which will work with ES6.
1 Like

Thanks a lot, didn’t know it was stage-2. Do you know if there is any alternative to react-thunk on codepen?

edit: they have a cdn, nvm