Wikipedia Viewer - React - Code improvements?

Hi FCC,

Do you have any suggestions for ways I might improve/simplify my code?

I’ve just finished my solution for the Wikipedia Viewer project:

My goal is to get better at web-dev fundamentals and react fundamentals.

Cheers!
-Brandon

I didn’t really look much at the code but I was confused how you had access to results inside the ResultList component without using props.

But now I see you didn’t declare the variables so the state is global. Which is a bad thing.

const WikiViewer = () =>  {
  [userInput, updateUserInput] = React.useState("");
  [results, updateResults] = React.useState([]);

  ...code
}

Should be:

const WikiViewer = () =>  {
  const [userInput, updateUserInput] = React.useState("");
  const [results, updateResults] = React.useState([]);

  ...code
}

With that change made, it will then give you the expected error that results is not defined. So now you have to use props in the ResultList component. You are also missing the key as the console will tell you.

I don’t really have time to look more at the code right now but, just as an aside, I would definitely suggest using fetch instead of XMLHttpRequest.

1 Like

Thanks for that feedback. I totally forgot to declare the variables.
I’m not familiar with fetch so I’ll research it.
Thank you.