[Docs] Consolidate the two examples sections
Also made the formatting more consistent between complementary-tools and examples.
Cheng Lou committed
Feb 23, 2014 at 18:58 UTC
25cafec4a9a6e50e4d35d9aee899b94540ef9dea
6 files changed
+55
-65
docs/_data/nav_docs.yml
+2
-4
@@ -8,8 +8,8 @@
8
title: Videos
9
- id: complementary-tools
10
title: Complementary Tools
11
- - id: example-apps
12
- title: Example Apps
11
+ - id: examples
12
+ title: Examples
13
- title: Guides
14
items:
15
- id: why-react
@@ -51,8 +51,6 @@
51
title: Cloning Components
52
- id: update
53
title: Immutability Helpers
54
- - id: examples
55
- title: Examples
54
- title: Reference
55
items:
56
- id: top-level-api
docs/docs/09.6-update.md
-1
@@ -4,7 +4,6 @@ title: Immutability Helpers
4
layout: docs
5
permalink: update.html
6
prev: clone-with-props.html
7
-next: examples.html
7
---
8
9
React lets you use whatever style of data management you want, including mutation. However, if you can use immutable data in performance-critical parts of your application it's easy to implement a fast `shouldComponentUpdate()` method to significantly speed up your app.
docs/docs/10-examples.md
deleted
-21
@@ -1,21 +0,0 @@
1
----
2
-id: examples
3
-title: Examples
4
-layout: docs
5
-permalink: examples.html
6
-prev: class-name-manipulation.html
7
----
8
-
9
-### Production Apps
10
-
11
-* All of [Instagram.com](http://instagram.com/) is built on React.
12
-* Many components on [Facebook.com](http://www.facebook.com/), including the commenting interface, ads creation flows, and page insights.
13
-* [Khan Academy](http://khanacademy.org/) is using React for most new JS development.
14
-
15
-
16
-### Sample Code
17
-
18
-* We've included [a step-by-step comment box tutorial](/react/docs/tutorial.html).
19
-* [The React starter kit](/react/downloads.html) includes several examples which you can [view online in our GitHub repository](https://github.com/facebook/react/tree/master/examples/).
20
-* [React one-hour email](https://github.com/petehunt/react-one-hour-email/commits/master) goes step-by-step from a static HTML mock to an interactive email reader (written in just one hour!)
21
-* [Rendr + React app template](https://github.com/petehunt/rendr-react-template/) demonstrates how to use React's server rendering capabilities.
docs/docs/complementary-tools.md
+25
-25
@@ -4,7 +4,7 @@ title: Complementary Tools
4
layout: docs
5
permalink: complementary-tools.html
6
prev: videos.html
7
-next: example-apps.html
7
+next: examples.html
8
---
9
10
React is a small library that does one thing well. Here's a list of tools we've found that work really well with React when building applications.
@@ -13,36 +13,36 @@ If you want your project on this list, or think one of these projects should be
13
14
### JSX integrations
15
16
- * **[jsxhint](https://npmjs.org/package/jsxhint)** [JSHint](http://jshint.com/) (linting) support
17
- * **[reactify](https://npmjs.org/package/reactify)** [Browserify](http://browserify.org/) transform
18
- * **[node-jsx](https://npmjs.org/package/node-jsx)** Native [Node](http://nodejs.org/) support
19
- * **[jsx-loader](https://npmjs.org/package/jsx-loader)** Loader for [webpack](http://webpack.github.io/)
20
- * **[grunt-react](https://npmjs.org/package/grunt-react)** [GruntJS](http://gruntjs.com/) task
21
- * **[gulp-react](https://npmjs.org/package/gulp-react)** [GulpJS](http://gulpjs.com/) plugin
22
- * **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin)** [RequireJS](http://requirejs.org/) plugin
23
- * **[react-meteor](https://github.com/benjamn/react-meteor)** [Meteor](http://www.meteor.com/) plugin
16
+ * **[jsxhint](https://npmjs.org/package/jsxhint)** [JSHint](http://jshint.com/) (linting) support.
17
+ * **[reactify](https://npmjs.org/package/reactify)** [Browserify](http://browserify.org/) transform.
18
+ * **[node-jsx](https://npmjs.org/package/node-jsx)** Native [Node](http://nodejs.org/) support.
19
+ * **[jsx-loader](https://npmjs.org/package/jsx-loader)** Loader for [webpack](http://webpack.github.io/).
20
+ * **[grunt-react](https://npmjs.org/package/grunt-react)** [GruntJS](http://gruntjs.com/) task.
21
+ * **[gulp-react](https://npmjs.org/package/gulp-react)** [GulpJS](http://gulpjs.com/) plugin.
22
+ * **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin)** [RequireJS](http://requirejs.org/) plugin.
23
+ * **[react-meteor](https://github.com/benjamn/react-meteor)** [Meteor](http://www.meteor.com/) plugin.
24
25
### Full-stack starter kits
26
27
- * **[react-quickstart](https://github.com/andreypopp/react-quickstart)** Quick-start template for `express`, `browserify`, `react-router-component` and `react-async` (**includes "isomorphic" server rendering**)
28
- * **[generator-react-webpack](https://github.com/newtriks/generator-react-webpack)** [Yeoman](http://yeoman.io/) generator for React and Webpack
29
- * **[Genesis Skeleton](http://genesis-skeleton.com/)** Modern, opinionated, full-stack starter kit for rapid, streamlined application development (supports React)
30
- * **[react-starter-template](https://github.com/johnthethird/react-starter-template)** Starter template with Gulp, Webpack and Bootstrap
31
- * **[react-brunch](https://npmjs.org/package/react-brunch)** [Brunch](http://brunch.io/) plugin
32
- * **[react-browserify-template](https://github.com/petehunt/react-browserify-template)** Quick-start with Browserify
27
+ * **[react-quickstart](https://github.com/andreypopp/react-quickstart)** Quick-start template for `express`, `browserify`, `react-router-component and `react-async` (**includes "isomorphic" server rendering**).
28
+ * **[generator-react-webpack](https://github.com/newtriks/generator-react-webpack)** [Yeoman](http://yeoman.io/) generator for React and Webpack.
29
+ * **[Genesis Skeleton](http://genesis-skeleton.com/)** Modern, opinionated, full-stack starter kit for rapid, streamlined application development (supports React).
30
+ * **[react-starter-template](https://github.com/johnthethird/react-starter-template)** Starter template with Gulp, Webpack and Bootstrap.
31
+ * **[react-brunch](https://npmjs.org/package/react-brunch)** [Brunch](http://brunch.io/) plugin.
32
+ * **[react-browserify-template](https://github.com/petehunt/react-browserify-template)** Quick-start with Browserify.
33
34
### Routing
35
36
- * **[director](https://github.com/flatiron/director)** (for an example see [TodoMVC](https://github.com/tastejs/todomvc/blob/gh-pages/architecture-examples/react/js/app.jsx#L29))
37
- * **[Backbone](http://backbonejs.org/)** (for an example see [github-issues-viewer](https://github.com/jaredly/github-issues-viewer))
38
- * **[react-router](https://github.com/jaredly/react-router)** (example coming soon)
36
+ * **[director](https://github.com/flatiron/director)** (For an example see [TodoMVC](https://github.com/tastejs/todomvc/blob/gh-pages/architecture-examples/react/js/app.jsx#L29)).
37
+ * **[Backbone](http://backbonejs.org/)** (For an example see [github-issues-viewer](https://github.com/jaredly/github-issues-viewer)).
38
+ * **[react-router](https://github.com/jaredly/react-router)** (Example coming soon).
39
* **[react-router-component](http://andreypopp.viewdocs.io/react-router-component)**
40
41
### Model management
42
43
- * **[react.backbone](https://github.com/usepropeller/react.backbone)** Use [Backbone](http://backbonejs.org) models with React
44
- * **[cortex](https://github.com/mquan/cortex/)** A JavaScript library for centrally managing data with React
45
- * **[avers](https://github.com/wereHamster/avers)** A modern client-side model abstraction library
43
+ * **[react.backbone](https://github.com/usepropeller/react.backbone)** Use [Backbone](http://backbonejs.org) models with React.
44
+ * **[cortex](https://github.com/mquan/cortex/)** A JavaScript library for centrally managing data with React.
45
+ * **[avers](https://github.com/wereHamster/avers)** A modern client-side model abstraction library.
46
47
### Data fetching
48
@@ -51,7 +51,7 @@ If you want your project on this list, or think one of these projects should be
51
52
### UI components
53
54
- * **[react-bootstrap](https://github.com/stevoland/react-bootstrap)** Bootstrap 3 components built with React
55
- * **[react-topcoat](https://github.com/plaxdan/react-topcoat)** Topcoat components built with React
56
- * **[react-lorem-component](https://github.com/martinandert/react-lorem-component)** Lorem Ipsum placeholder component
57
- * **[wingspan-forms](https://github.com/wingspan/wingspan-forms)** React library for dynamic forms & grids; widgets provided by KendoUI
54
+ * **[react-bootstrap](https://github.com/stevoland/react-bootstrap)** Bootstrap 3 components built with React.
55
+ * **[react-topcoat](https://github.com/plaxdan/react-topcoat)** Topcoat components built with React.
56
+ * **[react-lorem-component](https://github.com/martinandert/react-lorem-component)** Lorem Ipsum placeholder component.
57
+ * **[wingspan-forms](https://github.com/wingspan/wingspan-forms)** React library for dynamic forms & grids; widgets provided by KendoUI.
docs/docs/example-apps.md
deleted
-14
@@ -1,14 +0,0 @@
1
----
2
-id: example-apps
3
-title: Example apps
4
-layout: docs
5
-permalink: example-apps.html
6
-prev: complementary-tools.html
7
----
8
-
9
-Here is a selection of open-source apps built with React.
10
-
11
- * **[TodoMVC](https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/react/js)**
12
- * **[Khan Academy question editor](https://github.com/khan/perseus)** (browse their GitHub account for many more production apps!)
13
- * **[github-issues-viewer](https://github.com/jaredly/github-issues-viewer)**
14
- * **[hn-react](https://github.com/prabirshrestha/hn-react)** Dead-simple Hacker News client in React
docs/docs/examples.md
new
+28
@@ -0,0 +1,28 @@
1
+---
2
+id: examples
3
+title: Examples
4
+layout: docs
5
+permalink: examples.html
6
+prev: complementary-tools.html
7
+---
8
+
9
+### Production Apps
10
+
11
+* **[Instagram.com](http://instagram.com/)** Is 100% built on React.
12
+* **[Facebook.com](http://www.facebook.com/)** 's commenting interface, ads creation flows, and page insights.
13
+* **[Khan Academy](http://khanacademy.org/)** Uses React for most new JS development.
14
+
15
+
16
+### Sample Code
17
+
18
+* **[React starter kit](/react/downloads.html)** Includes several examples which you can [view online in our GitHub repository](https://github.com/facebook/react/tree/master/examples/).
19
+* **[React one-hour email](https://github.com/petehunt/react-one-hour-email/commits/master)** Goes step-by-step from a static HTML mock to an interactive email reader, written in just one hour!
20
+* **[Rendr + React app template](https://github.com/petehunt/rendr-react-template/)** Demonstrates how to use React's server rendering capabilities.
21
+
22
+
23
+### Open-Source Demos
24
+
25
+* **[TodoMVC](https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/react/js)**
26
+* **[Khan Academy question editor](https://github.com/khan/perseus)** (Browse their GitHub account for many more production apps!)
27
+* **[github-issue-viewer](https://github.com/jaredly/github-issues-viewer)**
28
+* **[hn-react](https://github.com/prabirshrestha/hn-react)** Dead-simple Hacker News client.