diff --git a/content/docs/typechecking-with-proptypes.md b/content/docs/typechecking-with-proptypes.md
index 4004e7820..c4f7a206a 100644
--- a/content/docs/typechecking-with-proptypes.md
+++ b/content/docs/typechecking-with-proptypes.md
@@ -1,26 +1,26 @@
---
id: typechecking-with-proptypes
-title: Typechecking With PropTypes
+title: Validation de types avec PropTypes
permalink: docs/typechecking-with-proptypes.html
redirect_from:
- "docs/react-api.html#typechecking-with-proptypes"
---
-> Note:
+> Remarque
>
-> `React.PropTypes` has moved into a different package since React v15.5. Please use [the `prop-types` library instead](https://www.npmjs.com/package/prop-types).
+> `React.PropTypes` a été déplacé dans un autre module depuis React v15.5. Merci de plutôt utiliser [le module `prop-types`](https://www.npmjs.com/package/prop-types).
>
->We provide [a codemod script](/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes) to automate the conversion.
+>Nous fournissons [un script codemod](/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes) pour automatiser cette transition.
-As your app grows, you can catch a lot of bugs with typechecking. For some applications, you can use JavaScript extensions like [Flow](https://flow.org/) or [TypeScript](https://www.typescriptlang.org/) to typecheck your whole application. But even if you don't use those, React has some built-in typechecking abilities. To run typechecking on the props for a component, you can assign the special `propTypes` property:
+Au fur et à mesure que votre application grandit, vous pouvez détecter un grand nombre de bugs grâce à la validation de types. Dans certains cas, vous pouvez utiliser des extensions JavaScript comme [Flow](https://flow.org/) ou [TypeScript](https://www.typescriptlang.org/) pour valider les types de toute votre application. Mais même si vous ne les utilisez pas, React possède ses propres fonctionnalités de validation de types. Pour lancer la validation de types des props d'un composant, vous pouvez ajouter la propriété spéciale `propTypes` :
-```javascript
+```javascript{11-13}
import PropTypes from 'prop-types';
class Greeting extends React.Component {
render() {
return (
-
@@ -143,45 +146,45 @@ MyComponent.propTypes = {
};
```
-### Default Prop Values {#default-prop-values}
+### Valeurs par défaut des props {#default-prop-values}
-You can define default values for your `props` by assigning to the special `defaultProps` property:
+Vous pouvez définir des valeurs par défaut pour vos `props` en utilisant la propriété spéciale `defaultProps` :
```javascript
class Greeting extends React.Component {
render() {
return (
-
Hello, {this.props.name}
+
Bonjour, {this.props.name}
);
}
}
-// Specifies the default values for props:
+// Spécifie les valeurs par défaut des props :
Greeting.defaultProps = {
- name: 'Stranger'
+ name: 'bel inconnu'
};
-// Renders "Hello, Stranger":
+// Affiche « Bonjour, bel inconnu » :
ReactDOM.render(
,
document.getElementById('example')
);
```
-If you are using a Babel transform like [transform-class-properties](https://babeljs.io/docs/plugins/transform-class-properties/) , you can also declare `defaultProps` as static property within a React component class. This syntax has not yet been finalized though and will require a compilation step to work within a browser. For more information, see the [class fields proposal](https://github.com/tc39/proposal-class-fields).
+Si vous utilisez une transformation Babel telle que [transform-class-properties](https://babeljs.io/docs/plugins/transform-class-properties/) , vous pouvez aussi déclarer `defaultProps` comme propriété statique dans une classe de composant React. Cependant, cette syntaxe n'a pas encore été finalisée et requiert une étape de compilation supplémentaire pour fonctionner dans un navigateur. Pour plus d'informations, voir la [proposition des aspects statiques de classe](https://github.com/tc39/proposal-static-class-features/).
```javascript
class Greeting extends React.Component {
static defaultProps = {
- name: 'stranger'
+ name: 'bel inconnu'
}
render() {
return (
-
Hello, {this.props.name}
+
Bonjour, {this.props.name}
)
}
}
```
-The `defaultProps` will be used to ensure that `this.props.name` will have a value if it was not specified by the parent component. The `propTypes` typechecking happens after `defaultProps` are resolved, so typechecking will also apply to the `defaultProps`.
+Les `defaultProps` seront utilisées pour s'assurer que `this.props.name` aura une valeur si elle n'était pas spécifiée par le composant parent. La validation de types des `propTypes` aura lieu après que `defaultProps` est résolu, la validation de types s'applique donc également aux `defaultProps`.