Docs: Rename code example toggles to better represent current state

[mkaz]

The code examples in the developer documentation, as well as the gutenberg-examples repo, use a delineation between two types of code: ES5 and ESNext

With the dropping of support for IE11, the targeted browsers all support the ES6 syntax. So the distinction is no longer accurate, as it is not between ES5 and a newer syntax; but between not building JavaScript and using JSX that requires a build.

So I think we should rename the toggles and our usage within documentation to better reflect this distinction.

My suggestion is to name the toggles: "JSX" and "Plain"

We discussed this also in the core-js meeting today, and it was also discussed in this ticket.

Changing the toggles will also clarify whether we need two sets of examples, as there has been some discussion around dropping ES5 support in docs.

For reference, our documentation around code examples recommends including ES5 examples for beginner tutorials but not required for all code examples.

Also for reference, looking to see how other documentation manages, in the React tutorial they show one example using non-JSX and the rest of their documentation uses JSX. For Preact, in the getting started guide they show an example using a JSX alternate (HTM), but then the rest of the documentation uses JSX.

So an alternative, which I'm not necessarily for but I'll include for this discussion to acknowledge it as an option, is to remove the code tabs and add a new section explaining JSX and build.

What do y'all think?

[ndiego]

I am biased, but I agree and recommend dropping all ES5 examples. I feel it is better to spend the effort educating new users on how to use JSX and more modern approaches to building with WordPress.