Paul O’Shannessy
11 years ago
1 changed files with 0 additions and 96 deletions
@ -1,96 +0,0 @@ |
|||||
--- |
|
||||
id: OUTLINE |
|
||||
title: Goals of the documentation |
|
||||
layout: docs |
|
||||
prev: 09.1-tutorial.html |
|
||||
--- |
|
||||
- Flow of docs should mimic progression of questions a new user would ask |
|
||||
- High information density -- assume the reader is adept at JS |
|
||||
- Talk about best practices |
|
||||
- JSFiddles for all code samples |
|
||||
- Provide background for some of the design decisions |
|
||||
- Less words less words less words! |
|
||||
|
|
||||
## Outline |
|
||||
|
|
||||
Motivation / Why React? |
|
||||
- Declarative (simple) |
|
||||
- Components (separation of concerns) |
|
||||
- Give it 5 minutes |
|
||||
|
|
||||
Displaying data |
|
||||
- Hello world example |
|
||||
- Reactive updates |
|
||||
- Components are just functions |
|
||||
- JSX syntax (link to separate doc?) |
|
||||
- JSX gotchas |
|
||||
|
|
||||
Interactivity and dynamic UIs |
|
||||
- Click handler example |
|
||||
- Event handlers / synthetic events (link to w3c docs) |
|
||||
- Under the hood: autoBind and event delegation (IE8 notes) |
|
||||
- React is a state machine |
|
||||
- How state works |
|
||||
- What components should have state? |
|
||||
- What should go in state? |
|
||||
- What shouldn't go in state? |
|
||||
|
|
||||
Scaling up: using multiple components |
|
||||
- Motivation: separate concerns |
|
||||
- Composition example |
|
||||
- Ownership (and owner vs. parent) |
|
||||
- Children |
|
||||
- Data flow (one-way data binding) |
|
||||
- A note on performance |
|
||||
|
|
||||
Building effective reusable components |
|
||||
- You should build a reusable component library (CSS, testing etc) |
|
||||
- Prop validation |
|
||||
- Transferring props: a shortcut |
|
||||
- Mixins |
|
||||
- Testing |
|
||||
|
|
||||
Forms |
|
||||
|
|
||||
Working with the browser |
|
||||
- The mock DOM |
|
||||
- Refs / getDOMNode() |
|
||||
- More about refs |
|
||||
- Component lifecycle |
|
||||
- Browser support and polyfills |
|
||||
|
|
||||
Working with your environment |
|
||||
- CDN-hosted React |
|
||||
- Using master |
|
||||
- In-browser JSX transform |
|
||||
- Productionizing: precompiled JSX |
|
||||
- Helpful open-source projects |
|
||||
|
|
||||
Integrating with other UI libraries |
|
||||
- Using jQuery plugins |
|
||||
- Letting jQuery manage React components |
|
||||
- Using with Backbone.View |
|
||||
- CoffeeScript |
|
||||
- Moving from Handlebars to React: an example |
|
||||
|
|
||||
Server / static rendering |
|
||||
- Motivation |
|
||||
- Simple example |
|
||||
- How does it work? (No DOM) |
|
||||
- Rendr + React |
|
||||
|
|
||||
Big ideas |
|
||||
- Animation |
|
||||
- Bootstrap bindings (responsive grids) |
|
||||
- Reactive CSS |
|
||||
- Web workers |
|
||||
- Native views |
|
||||
|
|
||||
Case studies |
|
||||
- Comment box tutorial from scratch |
|
||||
- From HTML mock to application: React one-hour email |
|
||||
- Jordan's LikeToggler example |
|
||||
|
|
||||
Reference |
|
||||
- API |
|
||||
- DOM differences |
|
Loading…
Reference in new issue