Transfering project to CodePen (Random Quote Machine)

Tell us what’s happening:

Hello.

I’ve been working on the random quote machine locally with nodeJS and my project was working, now I’m trying to get it to CodePen. I included in codePen parameters React, react-dom, redux and react-redux.

Now it gives me the error:
ReferenceError: require is not defined [index.html:61:554]

Clicking on it I see the script generating the error. From what I googled and understood, the ‘require’ isn’t supposed to be used client-side. However I didn’t put this script here, and I have no idea where it comes from. If I remove all the imports at the top of the javascript I don’t get this error but of course it’s complaining about the missing ‘createStore’.

Until now I couldn’t get anything to load on the page, except for the CSS background-color.

Your code so far

[https://codepen.io/Vinc3nt/pen/wRdgjp]

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:64.0) Gecko/20100101 Firefox/64.0.

Link to the challenge:

Remove all the imports and include react, reactdom, redux and react-redux again (I can’t see that in your pen), then change these lines:

const store = createStore(quoteReducer);
const Container = connect(mapStateToProps, mapDispatchToProps)(Presentational);
const Provider1 = Provider;

to

const store = Redux.createStore(quoteReducer);
const Container = ReactRedux.connect(mapStateToProps, mapDispatchToProps)(Presentational);
const Provider1 = ReactRedux.Provider;

and it works fine in codepen.

Happy holidays and have fun coding!

2 Likes

Thank you, it’s working!