Renamed Cookbook references to tips. Reworded intro (sounded weird because it still referenced cookbooks. Updated some entry ID's (some side nav links didn't match entry permalinks)

This commit is contained in:
Connor McSheffrey 2013-11-11 21:00:53 -08:00
parent 166043593d
commit bd535bd51c
16 changed files with 33 additions and 31 deletions

View File

@ -69,8 +69,8 @@ nav_docs_sections:
title: Event System
- id: dom-differences
title: DOM Differences
nav_cookbook:
- title: Cookbook
nav_tips:
- title: Tips
items:
- id: introduction
title: Introduction
@ -80,7 +80,7 @@ nav_cookbook:
title: If-Else in JSX
- id: self-closing-tag
title: Self-Closing Tag
- id: jsx-root-node-count
- id: maximum-number-of-jsx-root-nodes
title: Maximum Number of JSX Root Nodes
- id: style-props-value-px
title: Shorthand for Specifying Pixel Values in style props
@ -90,7 +90,7 @@ nav_cookbook:
title: Value of null for Controlled Input
- id: componentWillReceiveProps-not-triggered-after-mounting
title: componentWillReceiveProps Not Triggered After Mounting
- id: props-in-getInitialSate-as-anti-pattern
- id: props-in-getInitialState-as-anti-pattern
title: Props in getInitialState Is an Anti-Pattern
- id: dom-event-listeners
title: DOM Event Listeners in a Component

View File

@ -26,14 +26,14 @@
</div>
{% endfor %}
<!-- Cookbook Nav -->
{% for section in site.nav_cookbook %}
<!-- Tips Nav -->
{% for section in site.nav_tips %}
<div class="nav-docs-section">
<h3>{{ section.title }}</h3>
<ul>
{% for item in section.items %}
<li>
<a href="/react/cookbook/{{ item.id }}.html"{% if page.id == item.id %} class="active"{% endif %}>{{ item.title }}</a>
<a href="/react/tips/{{ item.id }}.html"{% if page.id == item.id %} class="active"{% endif %}>{{ item.title }}</a>
</li>
{% endfor %}
</ul>

View File

@ -1,6 +1,6 @@
---
layout: default
sectionid: cookbook
sectionid: tips
---
<section class="content wrap documentationContent">
@ -13,10 +13,10 @@ sectionid: cookbook
<div class="docs-prevnext">
{% if page.prev %}
<a class="docs-prev" href="/react/cookbook/{{ page.prev }}">&larr; Prev</a>
<a class="docs-prev" href="/react/tips/{{ page.prev }}">&larr; Prev</a>
{% endif %}
{% if page.next %}
<a class="docs-next" href="/react/cookbook/{{ page.next }}">Next &rarr;</a>
<a class="docs-next" href="/react/tips/{{ page.next }}">Next &rarr;</a>
{% endif %}
</div>

View File

@ -1,13 +1,15 @@
---
id: introduction
title: Introduction
layout: cookbook
layout: tips
permalink: introduction.html
next: inline-styles.html
---
The React cookbook provides common React tips, bite-sized information that can surprisingly answer lots of questions you might have had and warn you against common pitfalls.
The React tips section provides bite-sized information that can answer lots of questions you might have and warn you against common pitfalls.
### Contributing
Submit a pull request to the [React repo](https://github.com/facebook/react) following the cookbook entries' style. If you have a recipe that needs review prior to submitting a PR you can find help in the [#reactjs IRC on freenode](irc://chat.freenode.net/reactjs) or the [reactjs Google group](http://groups.google.com/group/reactjs).
Submit a pull request to the [React repo](https://github.com/facebook/react) following the cookbook entries' style. If you have a recipe that needs review prior to submitting a PR you can find help in the [#reactjs IRC on freenode](irc://chat.freenode.net/reactjs) or the [reactjs Google group](http://groups.google.com/group/reactjs). Also, check the [Tips Wiki][1] for entries in-progress and general guidelines on writing React tips.
[1]: https://github.com/facebook/react/wiki/Tips-(Previously-Cookbook)

View File

@ -1,7 +1,7 @@
---
id: inline-styles
title: Inline Styles
layout: cookbook
layout: tips
permalink: inline-styles.html
next: if-else-in-JSX.html
prev: introduction.html

View File

@ -1,7 +1,7 @@
---
id: if-else-in-JSX
title: If-Else in JSX
layout: cookbook
layout: tips
permalink: if-else-in-JSX.html
prev: inline-styles.html
next: self-closing-tag.html

View File

@ -1,7 +1,7 @@
---
id: self-closing-tag
title: Self-Closing Tag
layout: cookbook
layout: tips
permalink: self-closing-tag.html
prev: if-else-in-JSX.html
next: maximum-number-of-jsx-root-nodes.html

View File

@ -1,7 +1,7 @@
---
id: maximum-number-of-jsx-root-nodes
title: Maximum Number of JSX Root Nodes
layout: cookbook
layout: tips
permalink: maximum-number-of-jsx-root-nodes.html
prev: self-closing-tag.html
next: style-props-value-px.html

View File

@ -1,7 +1,7 @@
---
id: style-prop-value-px
id: style-props-value-px
title: Shorthand for Specifying Pixel Values in style props
layout: cookbook
layout: tips
permalink: style-props-value-px.html
prev: maximum-number-of-jsx-root-nodes.html
next: children-props-type.html
@ -16,7 +16,7 @@ var divStyle = {height: 10}; // rendered as "height:10px"
React.renderComponent(<div style={divStyle}>Hello World!</div>, mountNode);
```
See [Inline Styles](/react/docs/cookbook/inline-styles-tip.html) for more info.
See [Inline Styles](/react/docs/tips/inline-styles-tip.html) for more info.
Sometimes you _do_ want to keep the CSS properties unitless. Here's a list of properties that won't get the automatic "px" suffix:

View File

@ -1,7 +1,7 @@
---
id: children-props-type
title: Type of the Children props
layout: cookbook
layout: tips
permalink: children-props-type.html
prev: style-props-value-px.html
next: controlled-input-null-value.html

View File

@ -1,13 +1,13 @@
---
id: controlled-input-null-value
title: Value of null for Controlled Input
layout: cookbook
layout: tips
permalink: controlled-input-null-value.html
prev: children-props-type.html
next: componentWillReceiveProps-not-triggered-after-mounting.html
---
Specifying the `value` prop on a [controlled component](/react/docs/cookbook/forms.html) prevents the user from changing the input unless you desire so.
Specifying the `value` prop on a [controlled component](/react/docs/tips/forms.html) prevents the user from changing the input unless you desire so.
You might have run into a problem where `value` is specified, but the input can still be changed without consent. In this case, you might have accidentally set `value` to `undefined` or `null`.

View File

@ -1,12 +1,12 @@
---
id: componentWillReceiveProps-not-triggered-after-mounting
title: componentWillReceiveProps Not Triggered After Mounting
layout: cookbook
layout: tips
permalink: componentWillReceiveProps-not-triggered-after-mounting.html
prev: controlled-input-null-value.html
next: props-in-getInitialState-as-anti-pattern.html
---
`componentWillReceiveProps` isn't triggered after the node is put on scene. This is by design. Check out [other lifecycle methods](/react/docs/cookbook/component-specs.html) for the one that suits your needs.
`componentWillReceiveProps` isn't triggered after the node is put on scene. This is by design. Check out [other lifecycle methods](/react/docs/tips/component-specs.html) for the one that suits your needs.
The reason for that is because `componentWillReceiveProps` often handles the logic of comparing with the old props and acting upon changes; not triggering it at mounting (where there are no old props) helps in defining what the method does.

View File

@ -1,7 +1,7 @@
---
id: props-in-getInitialState-as-anti-pattern
title: Props in getInitialState Is an Anti-Pattern
layout: cookbook
layout: tips
permalink: props-in-getInitialState-as-anti-pattern.html
prev: componentWillReceiveProps-not-triggered-after-mounting.html
next: dom-event-listeners.html

View File

@ -1,7 +1,7 @@
---
id: dom-event-listeners
title: DOM Event Listeners in a Component
layout: cookbook
layout: tips
permalink: dom-event-listeners.html
prev: props-in-getInitialState-as-anti-pattern.html
next: initial-ajax.html
@ -9,7 +9,7 @@ next: initial-ajax.html
> Note:
>
> This entry shows how to attach DOM events not provided by React ([check here for more info](/react/docs/cookbook/events.html)). This is good for integrations with other libraries such as jQuery.
> This entry shows how to attach DOM events not provided by React ([check here for more info](/react/docs/tips/events.html)). This is good for integrations with other libraries such as jQuery.
Try to resize the window:

View File

@ -1,7 +1,7 @@
---
id: initial-ajax
title: Load Initial Data via AJAX
layout: cookbook
layout: tips
permalink: initial-ajax.html
prev: dom-event-listeners.html
next: false-in-jsx.html

View File

@ -1,7 +1,7 @@
---
id: false-in-jsx-tip
id: false-in-jsx
title: False in JSX
layout: cookbook
layout: tips
permalink: false-in-jsx.html
prev: initial-ajax.html
---