lukechilds
/
react.dev
mirror of https://github.com/lukechilds/react.dev.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

[Docs] Consolidate the two examples sections 

Also made the formatting more consistent between complementary-tools and
examples.
main
Cheng Lou 11 years ago
parent
7cbf8a6e76
commit
36e14d6b4c
6 changed files with 55 additions and 65 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      _data/nav_docs.yml
  2. 1
      docs/09.6-update.md
  3. 21
      docs/10-examples.md
  4. 50
      docs/complementary-tools.md
  5. 14
      docs/example-apps.md
  6. 28
      docs/examples.md

6
_data/nav_docs.yml
View File

@ -8,8 +8,8 @@
title: Videos title: Videos
- id: complementary-tools - id: complementary-tools
title: Complementary Tools title: Complementary Tools
- id: example-apps - id: examples
title: Example Apps title: Examples
- title: Guides - title: Guides
items: items:
- id: why-react - id: why-react
@ -51,8 +51,6 @@
title: Cloning Components title: Cloning Components
- id: update - id: update
title: Immutability Helpers title: Immutability Helpers
- id: examples
title: Examples
- title: Reference - title: Reference
items: items:
- id: top-level-api - id: top-level-api

1
docs/09.6-update.md
View File

@ -4,7 +4,6 @@ title: Immutability Helpers
layout: docs layout: docs
permalink: update.html permalink: update.html
prev: clone-with-props.html prev: clone-with-props.html
next: examples.html
--- ---
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. 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.

21
docs/10-examples.md
View File

@ -1,21 +0,0 @@
---
id: examples
title: Examples
layout: docs
permalink: examples.html
prev: class-name-manipulation.html
---
### Production Apps
* All of [Instagram.com](http://instagram.com/) is built on React.
* Many components on [Facebook.com](http://www.facebook.com/), including the commenting interface, ads creation flows, and page insights.
* [Khan Academy](http://khanacademy.org/) is using React for most new JS development.
### Sample Code
* We've included [a step-by-step comment box tutorial](/react/docs/tutorial.html).
* [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/).
* [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!)
* [Rendr + React app template](https://github.com/petehunt/rendr-react-template/) demonstrates how to use React's server rendering capabilities.

50
docs/complementary-tools.md
View File

@ -4,7 +4,7 @@ title: Complementary Tools
layout: docs layout: docs
permalink: complementary-tools.html permalink: complementary-tools.html
prev: videos.html prev: videos.html
next: example-apps.html next: examples.html
--- ---
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. 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
### JSX integrations ### JSX integrations
* **[jsxhint](https://npmjs.org/package/jsxhint)** [JSHint](http://jshint.com/) (linting) support * **[jsxhint](https://npmjs.org/package/jsxhint)** [JSHint](http://jshint.com/) (linting) support.
* **[reactify](https://npmjs.org/package/reactify)** [Browserify](http://browserify.org/) transform * **[reactify](https://npmjs.org/package/reactify)** [Browserify](http://browserify.org/) transform.
* **[node-jsx](https://npmjs.org/package/node-jsx)** Native [Node](http://nodejs.org/) support * **[node-jsx](https://npmjs.org/package/node-jsx)** Native [Node](http://nodejs.org/) support.
* **[jsx-loader](https://npmjs.org/package/jsx-loader)** Loader for [webpack](http://webpack.github.io/) * **[jsx-loader](https://npmjs.org/package/jsx-loader)** Loader for [webpack](http://webpack.github.io/).
* **[grunt-react](https://npmjs.org/package/grunt-react)** [GruntJS](http://gruntjs.com/) task * **[grunt-react](https://npmjs.org/package/grunt-react)** [GruntJS](http://gruntjs.com/) task.
* **[gulp-react](https://npmjs.org/package/gulp-react)** [GulpJS](http://gulpjs.com/) plugin * **[gulp-react](https://npmjs.org/package/gulp-react)** [GulpJS](http://gulpjs.com/) plugin.
* **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin)** [RequireJS](http://requirejs.org/) plugin * **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin)** [RequireJS](http://requirejs.org/) plugin.
* **[react-meteor](https://github.com/benjamn/react-meteor)** [Meteor](http://www.meteor.com/) plugin * **[react-meteor](https://github.com/benjamn/react-meteor)** [Meteor](http://www.meteor.com/) plugin.
### Full-stack starter kits ### Full-stack starter kits
* **[react-quickstart](https://github.com/andreypopp/react-quickstart)** Quick-start template for `express`, `browserify`, `react-router-component` and `react-async` (**includes "isomorphic" server rendering**) * **[react-quickstart](https://github.com/andreypopp/react-quickstart)** Quick-start template for `express`, `browserify`, `react-router-component and `react-async` (**includes "isomorphic" server rendering**).
* **[generator-react-webpack](https://github.com/newtriks/generator-react-webpack)** [Yeoman](http://yeoman.io/) generator for React and Webpack * **[generator-react-webpack](https://github.com/newtriks/generator-react-webpack)** [Yeoman](http://yeoman.io/) generator for React and Webpack.
* **[Genesis Skeleton](http://genesis-skeleton.com/)** Modern, opinionated, full-stack starter kit for rapid, streamlined application development (supports React) * **[Genesis Skeleton](http://genesis-skeleton.com/)** Modern, opinionated, full-stack starter kit for rapid, streamlined application development (supports React).
* **[react-starter-template](https://github.com/johnthethird/react-starter-template)** Starter template with Gulp, Webpack and Bootstrap * **[react-starter-template](https://github.com/johnthethird/react-starter-template)** Starter template with Gulp, Webpack and Bootstrap.
* **[react-brunch](https://npmjs.org/package/react-brunch)** [Brunch](http://brunch.io/) plugin * **[react-brunch](https://npmjs.org/package/react-brunch)** [Brunch](http://brunch.io/) plugin.
* **[react-browserify-template](https://github.com/petehunt/react-browserify-template)** Quick-start with Browserify * **[react-browserify-template](https://github.com/petehunt/react-browserify-template)** Quick-start with Browserify.
### Routing ### Routing
* **[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)) * **[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)).
* **[Backbone](http://backbonejs.org/)** (for an example see [github-issues-viewer](https://github.com/jaredly/github-issues-viewer)) * **[Backbone](http://backbonejs.org/)** (For an example see [github-issues-viewer](https://github.com/jaredly/github-issues-viewer)).
* **[react-router](https://github.com/jaredly/react-router)** (example coming soon) * **[react-router](https://github.com/jaredly/react-router)** (Example coming soon).
* **[react-router-component](http://andreypopp.viewdocs.io/react-router-component)** * **[react-router-component](http://andreypopp.viewdocs.io/react-router-component)**
### Model management ### Model management
* **[react.backbone](https://github.com/usepropeller/react.backbone)** Use [Backbone](http://backbonejs.org) models with React * **[react.backbone](https://github.com/usepropeller/react.backbone)** Use [Backbone](http://backbonejs.org) models with React.
* **[cortex](https://github.com/mquan/cortex/)** A JavaScript library for centrally managing data with React * **[cortex](https://github.com/mquan/cortex/)** A JavaScript library for centrally managing data with React.
* **[avers](https://github.com/wereHamster/avers)** A modern client-side model abstraction library * **[avers](https://github.com/wereHamster/avers)** A modern client-side model abstraction library.
### Data fetching ### Data fetching
@ -51,7 +51,7 @@ If you want your project on this list, or think one of these projects should be
### UI components ### UI components
* **[react-bootstrap](https://github.com/stevoland/react-bootstrap)** Bootstrap 3 components built with React * **[react-bootstrap](https://github.com/stevoland/react-bootstrap)** Bootstrap 3 components built with React.
* **[react-topcoat](https://github.com/plaxdan/react-topcoat)** Topcoat components built with React * **[react-topcoat](https://github.com/plaxdan/react-topcoat)** Topcoat components built with React.
* **[react-lorem-component](https://github.com/martinandert/react-lorem-component)** Lorem Ipsum placeholder component * **[react-lorem-component](https://github.com/martinandert/react-lorem-component)** Lorem Ipsum placeholder component.
* **[wingspan-forms](https://github.com/wingspan/wingspan-forms)** React library for dynamic forms & grids; widgets provided by KendoUI * **[wingspan-forms](https://github.com/wingspan/wingspan-forms)** React library for dynamic forms & grids; widgets provided by KendoUI.

14
docs/example-apps.md
View File

@ -1,14 +0,0 @@
---
id: example-apps
title: Example apps
layout: docs
permalink: example-apps.html
prev: complementary-tools.html
---
Here is a selection of open-source apps built with React.
* **[TodoMVC](https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/react/js)**
* **[Khan Academy question editor](https://github.com/khan/perseus)** (browse their GitHub account for many more production apps!)
* **[github-issues-viewer](https://github.com/jaredly/github-issues-viewer)**
* **[hn-react](https://github.com/prabirshrestha/hn-react)** Dead-simple Hacker News client in React

28
docs/examples.md
View File

@ -0,0 +1,28 @@
---
id: examples
title: Examples
layout: docs
permalink: examples.html
prev: complementary-tools.html
---
### Production Apps
* **[Instagram.com](http://instagram.com/)** Is 100% built on React.
* **[Facebook.com](http://www.facebook.com/)** 's commenting interface, ads creation flows, and page insights.
* **[Khan Academy](http://khanacademy.org/)** Uses React for most new JS development.
### Sample Code
* **[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/).
* **[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!
* **[Rendr + React app template](https://github.com/petehunt/rendr-react-template/)** Demonstrates how to use React's server rendering capabilities.
### Open-Source Demos
* **[TodoMVC](https://github.com/tastejs/todomvc/tree/gh-pages/architecture-examples/react/js)**
* **[Khan Academy question editor](https://github.com/khan/perseus)** (Browse their GitHub account for many more production apps!)
* **[github-issue-viewer](https://github.com/jaredly/github-issues-viewer)**
* **[hn-react](https://github.com/prabirshrestha/hn-react)** Dead-simple Hacker News client.
Write Preview
Loading…
Cancel
Save