Tutorial: make clear warnings are to be found in dev console
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 11.8k
- Forks
- 7.9k
- Avg merge
- 1d 11h
- Merged PRs (30d)
- 11
Description
I'm completely new to react and when I tried following https://reactjs.org/tutorial/tutorial.html , everything went smoothly except at the part before "Picking a Key" where it says
For now, we should see a list of the moves that have occurred in the game and a warning that says:
Warning: Each child in an array or iterator should have a unique “key” prop. Check the render method of “Game”.
I didn't realize codepen example had secretly overridden console.log to display the error msg in the page itself, so I thought I should be seeing the warning on my test page as well. I spent a long time looking for it, reexamining my code and setup, etc etc, and finally ended up asking and getting an answer on stackoverflow.
It's silly how the simplest things can become impossible hurdle for beginners who are learning on their own. I think a clarification that 1. for people following along with their own dev environment, this is to be found in the browser's developer console, and 2. the codepen example had changed console.log behavior but that's not the default to be expected.
Thank you very much.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the React tutorial at the section immediately before “Picking a Key,” and compare the CodePen example with the instructions for a local development environment. Clarify that the warning appears in the browser’s developer console and that CodePen overrides console.log to display it in the page; done when beginners are unlikely to search their page for the warning.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- documentation
- Issue type
- Documentation
- Difficulty
- 1/5
- Estimated time
- Under an hour
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 45/100