Add ESLint v9/flatconfig support warning and eslint-config-prettier s…

…ection (#28261)

eslint-config-prettier only needed if using community plugins like
airbnb or airbnb-base that include potentially clashing stylistic rules.
The default ESLint ruleset does not have these rules and so the extra
plugin is not required.

javascript/javascript_in_the_real_world/linting.md

@@ -40,6 +40,18 @@ The current version of the extension (2.4.4) will only pick up the workspace fol
 
 </div>
 
+<div class="lesson-note lesson-note--warning" markdown="1">
+
+#### ESLint v9 and flat config support
+
+The above ESLint doc links take you to the docs for v9, which was released in April 2024. v9 came with a lot of big changes, including forcing all ESLint config files to use the "flat config" format (`eslint.config.(m|c)js`).
+
+Because of these changes, some community plugins like [eslint-config-airbnb-base](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb-base) (which makes ESLint use airbnb's ruleset) have not yet been able to release a version that supports v9 or flat config.
+
+For the time being, if you wish to use airbnb's style guide with ESLint, you will need to use [ESLint's v8.57 version of the docs](https://eslint.org/docs/v8.x/use/getting-started) and make sure you use one of the older [eslintrc configuration file formats](https://eslint.org/docs/v8.x/use/configure/configuration-files), **not** the newer flat config format.
+
+</div>
+
 ### Prettier
 
 Prettier is *awesome*. It is similar to a linter, but serves a slightly different function. Prettier will take your JS code and then automatically format it according to a set of rules. Unlike a linter, it's not looking for style errors, but specifically targeting the layout of your code and making intelligent decisions about things like spaces, indentation levels and line-breaks.
@@ -52,7 +64,11 @@ Using prettier makes coding faster and easier! You don't have to worry about nai
 
 ### Using ESLint and Prettier
 
-We **highly** recommend that you install ESlint and Prettier and use them for all future projects. It will make your code easier to read, both for yourself and for anyone else looking at it. There is no special setup needed apart from installing both of them.
+We **highly** recommend that you install ESlint and Prettier and use them for all future projects. It will make your code easier to read, both for yourself and for anyone else looking at it.
+
+For most people using the default ESLint ruleset, there will be no special setup needed apart from installing both of them.
+
+Some community plugins, such as [eslint-config-airbnb-base](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb-base), turn on some stylistic rules that may clash with what Prettier formats. If you wish to use a plugin like `eslint-config-airbnb-base` and Prettier together, you will also need to install [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) which will turn off any of the ESLint rules that clash with Prettier. If you are using the default ESLint ruleset, you will not need this.
 
 ### Template repositories