[gatsby/www]: Fix ESLint warnings

[LekoArts]

Problem

When running yarn lint:code on Gatsby's repository you'll be greeted with some ESLint warnings. It would be nice to fix those warnings!

$ eslint --ignore-path .gitignore --ignore-path .prettierignore --ext .js,.jsx .

/mnt/e/Lennart/Development/GitHub/gatsby/examples/image-processing/src/pages/index.js
  211:68  warning  HTML entities must be escaped  react/no-unescaped-entities
  211:76  warning  HTML entities must be escaped  react/no-unescaped-entities
  250:40  warning  HTML entities must be escaped  react/no-unescaped-entities
  250:44  warning  HTML entities must be escaped  react/no-unescaped-entities
  259:24  warning  HTML entities must be escaped  react/no-unescaped-entities
  259:32  warning  HTML entities must be escaped  react/no-unescaped-entities
  259:43  warning  HTML entities must be escaped  react/no-unescaped-entities
  259:51  warning  HTML entities must be escaped  react/no-unescaped-entities
  270:24  warning  HTML entities must be escaped  react/no-unescaped-entities
  270:32  warning  HTML entities must be escaped  react/no-unescaped-entities
  270:43  warning  HTML entities must be escaped  react/no-unescaped-entities
  270:51  warning  HTML entities must be escaped  react/no-unescaped-entities

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-contentful/src/pages/image-api.js
   16:21  warning  HTML entities must be escaped  react/no-unescaped-entities
   65:59  warning  HTML entities must be escaped  react/no-unescaped-entities
   68:15  warning  HTML entities must be escaped  react/no-unescaped-entities
   69:28  warning  HTML entities must be escaped  react/no-unescaped-entities
   69:36  warning  HTML entities must be escaped  react/no-unescaped-entities
  228:16  warning  HTML entities must be escaped  react/no-unescaped-entities

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-contentful/src/pages/index.js
  45:21  warning  HTML entities must be escaped  react/no-unescaped-entities
  53:27  warning  HTML entities must be escaped  react/no-unescaped-entities

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-css-modules/src/pages/index.js
  12:14  warning  HTML entities must be escaped  react/no-unescaped-entities

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-drupal/src/pages/index.js
  129:17  warning  Missing "key" prop for element in iterator  react/jsx-key
  150:34  warning  HTML entities must be escaped               react/no-unescaped-entities
  189:17  warning  Missing "key" prop for element in iterator  react/jsx-key

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-drupal/src/pages/recipes.js
  13:11  warning  Missing "key" prop for element in iterator  react/jsx-key

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-drupal/src/templates/recipe.js
  56:23  warning  HTML entities must be escaped               react/no-unescaped-entities
  62:55  warning  Missing "key" prop for element in iterator  react/jsx-key
  69:65  warning  Missing "key" prop for element in iterator  react/jsx-key

/mnt/e/Lennart/Development/GitHub/gatsby/examples/using-redirects/src/pages/index.js
  56:22  warning  HTML entities must be escaped  react/no-unescaped-entities
  56:37  warning  HTML entities must be escaped  react/no-unescaped-entities

/mnt/e/Lennart/Development/GitHub/gatsby/packages/gatsby/cache-dir/static-entry.js
  55:5  warning  Missing "key" prop for element in array  react/jsx-key

/mnt/e/Lennart/Development/GitHub/gatsby/www/src/components/evaluation-table.js
   20:9   warning  Missing "key" prop for element in array  react/jsx-key
  117:17  warning  Missing "key" prop for element in array  react/jsx-key
  118:17  warning  Missing "key" prop for element in array  react/jsx-key
  123:23  warning  Missing "key" prop for element in array  react/jsx-key
  127:23  warning  Missing "key" prop for element in array  react/jsx-key
  164:23  warning  Missing "key" prop for element in array  react/jsx-key

/mnt/e/Lennart/Development/GitHub/gatsby/www/src/pages/features.js
  46:5  warning  Missing "key" prop for element in array  react/jsx-key
  49:5  warning  Missing "key" prop for element in array  react/jsx-key
  52:5  warning  Missing "key" prop for element in array  react/jsx-key
  55:5  warning  Missing "key" prop for element in array  react/jsx-key
  58:5  warning  Missing "key" prop for element in array  react/jsx-key
  64:5  warning  Missing "key" prop for element in array  react/jsx-key
  67:5  warning  Missing "key" prop for element in array  react/jsx-key
  68:5  warning  Missing "key" prop for element in array  react/jsx-key
  69:5  warning  Missing "key" prop for element in array  react/jsx-key
  70:5  warning  Missing "key" prop for element in array  react/jsx-key

✖ 47 problems (0 errors, 47 warnings)

Solution

Follow the How to Contribute guide. If you want to validate the fixes in the browser console you'll also need to run the www (gatsbyjs.org) site at some point.

To speed up the www developing you can pass an env variable for placeholder images. You'll also need to add a GitHub token. In the end your .env.development file should contain:

GITHUB_API_TOKEN=your-github-token
GATSBY_SCREENSHOT_PLACEHOLDER=true

To validate that you fixed the warnings run yarn lint:code in the root of the repo again.

[anothertempore]

Hi LekoArts, can I work on this issue?

[DSchau]

@Kexin-Li you sure can! We'd love if you do!

Please feel free to reach out if you have any questions.

[LekoArts]

@Kexin-Li Hi! How is it going with the PR? Do you have already worked on it? Just wanna ask you since @markusguenther opened a PR for that and I didn't want to pass you over.

[anothertempore]

@LekoArts , @DSchau Hi! I just finished this work, and I think @markusguenther's code is better than mine. I'll open a PR if you don't mind. Feel free to merge the better one.

[markusguenther]

Sorry did not see a PR for that and so I just started. The solutions are not that different ;) But @LekoArts will decide. Sorry that it is more review work now.

[LekoArts]

@Kexin-Li Thanks for being so understanding 👍 I've closed your PR in favor of markus' one but as I commented: We'd be happy to have you as a contributor and you can have a look at other issues. Thanks!