Skip to content

Sync with reactjs.org @ 022c1b2f #134

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 19 commits into from
Feb 20, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion content/blog/2015-08-11-relay-technical-preview.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ While React simplified the process of developing complex user-interfaces, it lef

Declarative data-fetching means that Relay applications specify *what* data they need, not *how* to fetch that data. Just as React uses a description of the desired UI to manage view updates, Relay uses a data description in the form of GraphQL queries. Given these descriptions, Relay coalesces queries into batches for efficiency, manages error-prone asynchronous logic, caches data for performance, and automatically updates views as data changes.

Relay is also component-oriented, extending the notion of a React component to include a description of what data is necessary to render it. This colocation allows developers to reason locally about their application and eliminates bugs such as under- or over-fetching data.
Relay is also component-oriented, extending the notion of a React component to include a description of what data is necessary to render it. This collocation allows developers to reason locally about their application and eliminates bugs such as under- or over-fetching data.

Relay is in use at Facebook in production apps, and we're using it more and more because *Relay lets developers focus on their products and move fast*. It's working for us and we'd like to share it with the community.

Expand Down
5 changes: 5 additions & 0 deletions content/community/conferences.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,11 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c
January 31, 2019 in Tehran, Iran
[Website](http://reactiran.com) - [Instagram](https://www.instagram.com/reactiran/)

### Reactathon 2019 {#reactathon-2019}
March 30-31, 2019 in San Francisco, USA

[Website](https://www.reactathon.com/) - [Twitter](https://twitter.com/reactathon)

### App.js Conf 2019 {#appjs-conf-2019}
April 4-5, 2019 in Kraków, Poland

Expand Down
2 changes: 1 addition & 1 deletion content/docs/addons-test-utils.md
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ Pass a mocked component module to this method to augment it with useful methods

> Note:
>
> `mockComponent()` is a legacy API. We recommend using [shallow rendering](/docs/test-utils.html#shallow-rendering) or [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock) instead.
> `mockComponent()` is a legacy API. We recommend using [shallow rendering](/docs/shallow-renderer.html) or [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock) instead.

* * *

Expand Down
2 changes: 1 addition & 1 deletion content/docs/higher-order-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const EnhancedComponent = higherOrderComponent(WrappedComponent);

コンポーネントが props を UI に変換するのに対して、高階コンポーネントはコンポーネントを別のコンポーネントに変換します。

HOC は Redux における [`connect 関数`](https://github.com/reactjs/react-redux/blob/master/docs/api/connect.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options) や Relay における [`createFragmentContainer`](http://facebook.github.io/relay/docs/en/fragment-container.html) のように、サードパーティ製の React ライブラリでは一般的なものです。
HOC は Redux における [`connect`](https://github.com/reactjs/react-redux/blob/master/docs/api/connect.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options) や Relay における [`createFragmentContainer`](http://facebook.github.io/relay/docs/en/fragment-container.html) のように、サードパーティ製の React ライブラリでは一般的なものです。

このドキュメントでは、なぜ高階コンポーネントが便利で、自身でどのように記述するのかを説明します。

Expand Down
4 changes: 1 addition & 3 deletions content/docs/hooks-intro.md
Original file line number Diff line number Diff line change
Expand Up @@ -97,9 +97,7 @@ React 開発者はプロダクト開発に注力する必要があり、リリ

また、React に新しい基本機能を付け加えるハードルが非常に高いということも理解しています。興味ある読者のために我々は[詳しい RFC](https://github.com/reactjs/rfcs/pull/68) を用意しています。そこではより詳しく動機を掘り下げており、関連する先行技術や個別の設計上の選択についての概要が述べられています。

**肝心なことですが、フックは既存のコードと併用することができるので、段階的に採用していくことが可能です。**我々は将来の React を形作っていくことに興味があるコミュニティの人々から初期フィードバックを得るためにこの実験的な API を公開しており、開かれた場で開発サイクルを進めていきます。

最後に、フックへの移行を急ぐ必要はありません。特に既存の複雑なコンポーネントについては、「大幅な書き換え」は避けることを推奨します。『フックで考えられる』ようになるには若干の思考の転換が必要です。我々の経験上は、あまり重要でない新しいコンポーネントでまずフックの使い方を練習し、チームの全員が慣れるようにすることが最良です。フックを試してみたら、どうぞお気軽に[フィードバックを送って](https://github.com/facebook/react/issues/new)ください。ポジティブなものでもネガティブなものでも構いません。
**肝心なことですが、フックは既存のコードと併用することができるので、段階的に採用していくことが可能です。**フックへの移行を急ぐ必要はありません。特に既存の複雑なコンポーネントについては、「大幅な書き換え」は避けることを推奨します。『フックで考えられる』ようになるには若干の思考の転換が必要です。我々の経験上は、あまり重要でない新しいコンポーネントでまずフックの使い方を練習し、チームの全員が慣れるようにすることが最良です。フックを試してみたら、どうぞお気軽に[フィードバックを送って](https://github.com/facebook/react/issues/new)ください。ポジティブなものでもネガティブなものでも構いません。

クラスコンポーネントのユースケースをすべてフックがカバーできるようにする予定ではいますが、**クラスコンポーネントのサポートも予見可能な将来にわたって続けていきます。**Facebook では何万というコンポーネントがクラスとして書かれており、それらを書き換える予定は全くありません。代わりに、クラスと併用しながら新しいコードでフックを使っていく予定でいます。

Expand Down
12 changes: 10 additions & 2 deletions content/docs/static-type-checking.md
Original file line number Diff line number Diff line change
Expand Up @@ -216,10 +216,18 @@ Congrats! You've installed the latest version of TypeScript into your project. I
```

### Configuring the TypeScript Compiler {#configuring-the-typescript-compiler}
The compiler is of no help to us until we tell it what to do. In TypeScript, these rules are defined in a special file called `tsconfig.json`. To generate this file run:
The compiler is of no help to us until we tell it what to do. In TypeScript, these rules are defined in a special file called `tsconfig.json`. To generate this file:

If you use [Yarn](https://yarnpkg.com/), run:

```bash
yarn run tsc --init
```

If you use [npm](https://www.npmjs.com/), run:

```bash
tsc --init
npx tsc --init
```

Looking at the now generated `tsconfig.json`, you can see that there are many options you can use to configure the compiler. For a detailed description of all the options, check [here](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html).
Expand Down
7 changes: 0 additions & 7 deletions src/pages/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -310,13 +310,6 @@ Home.propTypes = {
}).isRequired,
};

function renderExamplePlaceholder(containerId) {
ReactDOM.render(
<h4>Loading code example...</h4>,
document.getElementById(containerId),
);
}

const CtaItem = ({children, primary = false}) => (
<div
css={{
Expand Down