Replace React integration demo with proper documentation #73

tehapo · 2016-09-29T12:39:44Z

Fixes vaadin/components-team-tasks#210

This change is

Saulis · 2016-10-03T12:25:33Z

thx @tehapo ! Stay awesome! ping @magi42 for review.

Review status: 0 of 9 files reviewed at latest revision, all discussions resolved.

Comments from Reviewable

magi42 · 2016-10-05T12:33:58Z

Reviewed 9 of 9 files at r1.
Review status: all files reviewed at latest revision, 7 unresolved discussions.

docs/integrations/integrations-react.adoc, line 2 at r1 (raw file):

---
title: Overview

This is the title shown in the menu, it should match the article title below (can be shortened in the menu)

docs/integrations/integrations-react.adoc, line 9 at r1 (raw file):

# React Integration

The link:https://facebook.github.io/react/[React] library from Facebook integrates easily with web components.

"integrates with web components easily" or "easily integrates" – adverbs of manner have either end or mid position. http://dictionary.cambridge.org/us/grammar/british-grammar/adverbs-and-adverb-phrases-position

docs/integrations/integrations-react.adoc, line 14 at r1 (raw file):

ifdef::web[]
====
See also the link:https://facebook.github.io/react/docs/webcomponents.html[Web Components page] within React documentation.

within -> in

docs/integrations/integrations-react.adoc, line 25 at r1 (raw file):

image::img/react-integration.png[]

The example consists of two React components, `UserApp` and `UserGrid`.

Lists should be introduced with colon (:), not with comma
The React components look like they follow naming convention for classes. Maybe [classname] style should be used for them?

docs/integrations/integrations-react.adoc, line 27 at r1 (raw file):

The example consists of two React components, `UserApp` and `UserGrid`.
The `UserGrid` component wraps the [vaadinelement]#vaadin-grid# element and does all necessary initialization to display a list of random users.
As React doesn't support link:https://facebook.github.io/react/docs/jsx-gotchas.html#custom-html-attributes[custom attributes] on standard elements, [vaadinelement]#vaadin-grid# DOM API can't be fully utilized in the initialization.

Don't use contractions: doesn't -> does not, can't -> cannot

docs/integrations/integrations-react.adoc, line 28 at r1 (raw file):

The `UserGrid` component wraps the [vaadinelement]#vaadin-grid# element and does all necessary initialization to display a list of random users.
As React doesn't support link:https://facebook.github.io/react/docs/jsx-gotchas.html#custom-html-attributes[custom attributes] on standard elements, [vaadinelement]#vaadin-grid# DOM API can't be fully utilized in the initialization.
Fortunately [vaadinelement]#vaadin-grid# also provides corresponding JavaScript APIs.

Comma after sentence adverb: "Fortunately, "

docs/integrations/integrations-react.adoc, line 35 at r1 (raw file):

The code below can be run and forked as a JSFiddle at https://jsfiddle.net/pw1nLaL8/2/.

```javascript

````` is for monotext, but this is a source code listing and you want syntax highlighting, so use:

  [source, JavaScript]
  ----
  ...
  ----

Comments from Reviewable

Saulis · 2016-10-06T07:12:41Z

Review status: all files reviewed at latest revision, 7 unresolved discussions.

docs/integrations/integrations-react.adoc, line 2 at r1 (raw file):