Skip to content

Commit 5fc7867

Browse files
Merge branch 'master' into accessibility-translation
2 parents 9446acf + 4356f64 commit 5fc7867

File tree

73 files changed

+557
-546
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

73 files changed

+557
-546
lines changed

content/blog/2015-08-11-relay-technical-preview.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ While React simplified the process of developing complex user-interfaces, it lef
1313

1414
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.
1515

16-
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.
16+
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.
1717

1818
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.
1919

content/blog/2018-09-10-introducing-the-react-profiler.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ It also shows that each time it rendered, it was the most "expensive" component
140140

141141
To view this chart, either double-click on a component _or_ select a component and click on the blue bar chart icon in the right detail pane.
142142
You can return to the previous chart by clicking the "x" button in the right detail pane.
143-
You can aso double click on a particular bar to view more information about that commit.
143+
You can also double click on a particular bar to view more information about that commit.
144144

145145
![How to view all renders for a specific component](../images/blog/introducing-the-react-profiler/see-all-commits-for-a-fiber.gif)
146146

content/community/conferences.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,11 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c
1616
January 31, 2019 in Tehran, Iran
1717
[Website](http://reactiran.com) - [Instagram](https://www.instagram.com/reactiran/)
1818

19+
### Reactathon 2019 {#reactathon-2019}
20+
March 30-31, 2019 in San Francisco, USA
21+
22+
[Website](https://www.reactathon.com/) - [Twitter](https://twitter.com/reactathon)
23+
1924
### App.js Conf 2019 {#appjs-conf-2019}
2025
April 4-5, 2019 in Kraków, Poland
2126

@@ -31,11 +36,21 @@ May 23-24, 2019 in Paris, France
3136

3237
[Website](https://www.react-europe.org) - [Twitter](https://twitter.com/ReactEurope) - [Facebook](https://www.facebook.com/ReactEurope) - [Videos](https://www.youtube.com/c/ReacteuropeOrgConf)
3338

39+
### React Conf Armenia 2019 {#react-conf-am-19}
40+
May 25, 2019 in Yerevan, Armenia
41+
42+
[Website](https://reactconf.am/) - [Twitter](https://twitter.com/ReactConfAM) - [Facebook](https://www.facebook.com/reactconf.am/) - [YouTube](https://www.youtube.com/c/JavaScriptConferenceArmenia) - [CFP](http://bit.ly/speakReact)
43+
3444
### React Norway 2019 {#react-norway-2019}
3545
June 12, 2019. Larvik, Norway
3646

3747
[Website](https://reactnorway.com) - [Twitter](https://twitter.com/ReactNorway)
3848

49+
### React Loop 2019 {#react-loop-2019}
50+
June 21, 2019 Chicago, Illinois USA
51+
52+
[Website](https://reactloop.com) - [Twitter](https://twitter.com/ReactLoop)
53+
3954
### ComponentsConf 2019 {#componentsconf-2019}
4055
September 6, 2019 in Melbourne, Australia
4156
[Website](https://www.componentsconf.com.au/) - [Twitter](https://twitter.com/componentsconf)

content/docs/accessibility.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -152,6 +152,7 @@ Proporcione un mecanismo para permitir que los usuarios omitan las secciones de
152152

153153
Skiplink o Skip Navigation son enlaces de navegación ocultos que solo se hacen visibles cuando los usuarios de teclado interactúan con la página. Son muy fáciles de implementar con anclajes internos de página y algunos estilos:
154154

155+
155156
- [WebAIM - Omitir enlaces de navegación](http://webaim.org/techniques/skipnav/)
156157

157158
También utilice elementos y roles de puntos de referencia, como `<main>` y `<aside>`, para delimitar las regiones de la página ya que la tecnología de asistencia permite al usuario navegar rápidamente a estas secciones.

content/docs/add-react-to-a-website.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ Lo siguiente es agregar tres etiquetas `<script>` a la página HTML justo antes
5757
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
5858
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
5959
60-
<!-- Carguemos nuestro componente de React. -->
60+
<!-- Cargamos nuestro componente de React. -->
6161
<script src="like_button.js"></script>
6262
6363
</body>
@@ -147,9 +147,9 @@ return (
147147
);
148148
```
149149

150-
Estos dos fragmentos de código son equivalentes. Mientras **JSX es [completamente opcional](/docs/react-without-jsx.html)**, muchas personas lo encuentran útil para escribir código relacionado con la IU -- ya sea usando React o con otras bibliotecas.
150+
Estos dos fragmentos de código son equivalentes. Mientras **JSX es [completamente opcional](/docs/react-without-jsx.html)**, muchas personas lo encuentran útil para escribir código relacionado con la interfaz de usuario -- ya sea usando React o con otras bibliotecas.
151151

152-
Puedes experimentar con JSX usando [este conversor en línea](http://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=).
152+
Puedes experimentar con JSX usando [este conversor en línea](https://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=).
153153

154154
### Prueba JSX de forma rápida {#quickly-try-jsx}
155155

@@ -197,6 +197,6 @@ No esperes hasta que termine -- este comando inicia un observador automático pa
197197

198198
Si ahora creas un archivo llamado `src/like_button.js` con este **[código inicial de JSX](https://cdn.rawgit.com/gaearon/c8e112dc74ac44aac4f673f2c39d19d1/raw/09b951c86c1bf1116af741fa4664511f2f179f0a/like_button.js)**, el observador va a crear un `like_button.js` preprocesado con el código JavaScript original que es apto para el navegador. Cuando edites el código del archivo que tiene JSX, el transformador va a volver a ejecutarse de forma automática.
199199

200-
Como un bonus, esto también te permite utilizar características nuevas de la sintaxis de JavaScript, como las clases, sin que te preocupes de que no funcionen en navegadores antiguos. La herramienta que hemos usado se llama Babel, y puedes leer más sobre ella en [su documentación](http://babeljs.io/docs/en/babel-cli/).
200+
Como un bonus, esto también te permite utilizar características nuevas de la sintaxis de JavaScript, como las clases, sin que te preocupes de que no funcionen en navegadores antiguos. La herramienta que hemos usado se llama Babel, y puedes leer más sobre ella en [su documentación](https://babeljs.io/docs/en/babel-cli/).
201201

202202
Si notas que se te está haciendo más cómodo manejar las herramientas de configuración y quieres sacarle mayor provecho, [en la próxima sección](/docs/create-a-new-react-app.html) se describen unas de las cadenas de herramientas más populares y accesibles. Dado el caso que no te sientas así -- esas etiquetas de script serán suficiente.

content/docs/addons-perf.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,8 @@ In addition to giving you an overview of your app's overall performance, `Perf`
2727
See these articles for an introduction to React performance tooling:
2828

2929
- ["How to Benchmark React Components"](https://medium.com/code-life/how-to-benchmark-react-components-the-quick-and-dirty-guide-f595baf1014c)
30-
- ["Performance Engineering with React"](http://benchling.engineering/performance-engineering-with-react/)
31-
- ["A Deep Dive into React Perf Debugging"](http://benchling.engineering/deep-dive-react-perf-debugging/)
30+
- ["Performance Engineering with React"](https://benchling.engineering/performance-engineering-with-react/)
31+
- ["A Deep Dive into React Perf Debugging"](https://benchling.engineering/deep-dive-react-perf-debugging/)
3232

3333
### Development vs. Production Builds {#development-vs-production-builds}
3434

content/docs/addons-shallow-renderer.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ category: Referencia
1010

1111
```javascript
1212
import ShallowRenderer from 'react-test-renderer/shallow'; // ES6
13-
var ShallowRenderer = require('react-test-renderer/shallow'); // ES5 with npm
13+
var ShallowRenderer = require('react-test-renderer/shallow'); // ES5 con npm
1414
```
1515

1616
## Resumen {#resumen}
@@ -35,7 +35,7 @@ Entonces puedes comprobar:
3535
```javascript
3636
import ShallowRenderer from 'react-test-renderer/shallow';
3737

38-
// en tu test:
38+
// en tu prueba:
3939
const renderer = new ShallowRenderer();
4040
renderer.render(<MyComponent />);
4141
const result = renderer.getRenderOutput();
@@ -47,11 +47,11 @@ expect(result.props.children).toEqual([
4747
]);
4848
```
4949

50-
Las pruebas superficiales tienen algunas limitaciones, es decir, no soportan refs.
50+
Las pruebas superficiales tienen algunas limitaciones, es decir, no soportan referencias.
5151

5252
> Nota:
5353
>
54-
> También recomendamos revisar [Shallow Rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) de Enzyme. Provee un API de alto nivel mucho mejor de la misma funcionalidad.
54+
> También recomendamos revisar la [API de Renderizado Superficial](https://airbnb.io/enzyme/docs/api/shallow.html) de Enzyme. Provee una API de alto nivel mucho mejor de la misma funcionalidad.
5555
5656
## Referencia {#referencia}
5757

content/docs/addons-test-utils.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,18 @@ category: Reference
1010

1111
```javascript
1212
import ReactTestUtils from 'react-dom/test-utils'; // ES6
13-
var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm
13+
var ReactTestUtils = require('react-dom/test-utils'); // ES5 con npm
1414
```
1515

1616
## Introducción {#overview}
1717

18-
`ReactTestUtils` facilita probar los componentes de React en cualquiera de los frameworks de pruebas que elijas. En Facebook usamos [Jest](https://facebook.github.io/jest/) para realizar las pruebas de JavaScript sin problemas. Aprende como iniciar con Jest en el [tutorial para React](http://facebook.github.io/jest/docs/en/tutorial-react.html#content) que se encuentra en el sitio web de Jest.
18+
`ReactTestUtils` facilita probar los componentes de React en cualquiera de los frameworks de pruebas que elijas. En Facebook usamos [Jest](https://facebook.github.io/jest/) para realizar las pruebas de JavaScript sin problemas. Aprende como iniciar con Jest en el [tutorial para React](https://jestjs.io/docs/tutorial-react) que se encuentra en el sitio web de Jest.
1919

2020
> Nota:
2121
>
2222
> Recomendamos utilizar [`react-testing-library`](https://git.io/react-testing-library) que está diseñada para permitir e incentivar la escritura de las pruebas para que usen los componentes de la misma forma en que lo harían los usuarios finales.
2323
>
24-
> Como otra opción, Airbnb ha liberado una utilidad de pruebas llamada [Enzyme](http://airbnb.io/enzyme/), que hace fácil asegurar, manipular y navegar por los resultados de tus Componentes de React.
24+
> Como otra opción, Airbnb ha liberado una utilidad de pruebas llamada [Enzyme](https://airbnb.io/enzyme/), que hace fácil asegurar, manipular y navegar por los resultados de tus Componentes de React.
2525
2626
- [`act()`](#act)
2727
- [`mockComponent()`](#mockcomponent)
@@ -139,7 +139,7 @@ Pasa un módulo de un componente a simular a este método para mejorarlo con mé
139139

140140
> Nota:
141141
>
142-
> `mockComponent()` es una API heredada. En su lugar, recomendamos usar [renderizado superficial](/docs/test-utils.html#shallow-rendering) o [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock).
142+
> `mockComponent()` es una API heredada. En su lugar, recomendamos usar [renderizado superficial](/docs/shallow-renderer.html) o [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock).
143143
144144
* * *
145145

@@ -208,7 +208,7 @@ findAllInRenderedTree(
208208
)
209209
```
210210

211-
Navega por todos los componentes en `tree` y acumula todos los componentes en donde `test(component)` sea `true`. Esto no es útil por sí solo, pero es utilizado como primitivo para otras utilidades de prueba.
211+
Navega por todos los componentes en `tree` y acumula todos los componentes en donde `test(component)` sea `true`. Esto no es útil por sí solo, pero es utilizado como primitiva para otras utilidades de prueba.
212212

213213
* * *
214214

content/docs/addons-update.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ var update = require('react-addons-update'); // ES5 with npm
2121

2222
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()`](/docs/react-component.html#shouldcomponentupdate) method to significantly speed up your app.
2323

24-
Dealing with immutable data in JavaScript is more difficult than in languages designed for it, like [Clojure](http://clojure.org/). However, we've provided a simple immutability helper, `update()`, that makes dealing with this type of data much easier, *without* fundamentally changing how your data is represented. You can also take a look at Facebook's [Immutable-js](https://facebook.github.io/immutable-js/docs/) and the [Advanced Performance](/docs/advanced-performance.html) section for more detail on Immutable-js.
24+
Dealing with immutable data in JavaScript is more difficult than in languages designed for it, like [Clojure](https://clojure.org/). However, we've provided a simple immutability helper, `update()`, that makes dealing with this type of data much easier, *without* fundamentally changing how your data is represented. You can also take a look at Facebook's [Immutable-js](https://facebook.github.io/immutable-js/docs/) and the [Advanced Performance](/docs/advanced-performance.html) section for more detail on Immutable-js.
2525

2626
### The Main Idea {#the-main-idea}
2727

@@ -67,7 +67,7 @@ const newData = update(myData, {
6767
});
6868
```
6969

70-
While the syntax takes a little getting used to (though it's inspired by [MongoDB's query language](http://docs.mongodb.org/manual/core/crud-introduction/#query)) there's no redundancy, it's statically analyzable and it's not much more typing than the mutative version.
70+
While the syntax takes a little getting used to (though it's inspired by [MongoDB's query language](https://docs.mongodb.com/manual/crud/#query)) there's no redundancy, it's statically analyzable and it's not much more typing than the mutative version.
7171

7272
The `$`-prefixed keys are called *commands*. The data structure they are "mutating" is called the *target*.
7373

content/docs/code-splitting.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ configurado para ti y puedes comenzar a [usarlo](https://github.com/facebookincu
9494

9595
Si configuras Webpack por ti mismo, probablemente vas a querer leer la [guía sobre división de código](https://webpack.js.org/guides/code-splitting/) de Webpack. Tu configuración de Webpack debería verse vagamente [como esta](https://gist.github.com/gaearon/ca6e803f5c604d37468b0091d9959269).
9696

97-
Cuando uses [Babel](http://babeljs.io/), tienes que asegurarte de que Babel reconozca la sintaxis de `import()` dinámico pero no la transforme. Para ello vas a necesitar el [babel-plugin-syntax-dynamic-import](https://yarnpkg.com/en/package/babel-plugin-syntax-dynamic-import).
97+
Cuando uses [Babel](https://babeljs.io/), tienes que asegurarte de que Babel reconozca la sintaxis de `import()` dinámico pero no la transforme. Para ello vas a necesitar el [babel-plugin-syntax-dynamic-import](https://yarnpkg.com/es-ES/package/babel-plugin-syntax-dynamic-import).
9898

9999
## `React.lazy` {#reactlazy}
100100

@@ -202,7 +202,7 @@ const MyComponent = () => (
202202

203203
Decidir en qué parte de tu aplicación introducir la división de código puede ser un poco complicado. Quieres asegurarte de elegir lugares que dividan los *bundles* de manera uniforme, sin interrumpir la experiencia del usuario.
204204

205-
Un buen lugar para comenzar es con las rutas. La mayoría de la gente en la web está acostumbrada a que las transiciones entre páginas se tomen cierto tiempo en cargar. También tiendes a rerenderizar todo de una vez, así que es improbable que tus usuarios interactúen con otros elementos en la página al mismo tiempo.
205+
Un buen lugar para comenzar es con las rutas. La mayoría de la gente en la web está acostumbrada a que las transiciones entre páginas se tomen cierto tiempo en cargar. También tiendes a volver a renderizar todo de una vez, así que es improbable que tus usuarios interactúen con otros elementos en la página al mismo tiempo.
206206

207207
Este es un ejemplo de cómo configurar la división de código basada en rutas en tu aplicación usando
208208
bibliotecas como [React Router](https://reacttraining.com/react-router/) con `React.lazy`.

content/docs/codebase-overview.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ There are multiple injection points in the codebase. In the future, we intend to
155155

156156
### Multiple Packages {#multiple-packages}
157157

158-
React is a [monorepo](http://danluu.com/monorepo/). Its repository contains multiple separate packages so that their changes can be coordinated together, and issues live in one place.
158+
React is a [monorepo](https://danluu.com/monorepo/). Its repository contains multiple separate packages so that their changes can be coordinated together, and issues live in one place.
159159

160160
### React Core {#react-core}
161161

@@ -171,7 +171,7 @@ The code for React core is located in [`packages/react`](https://github.com/face
171171

172172
### Renderers {#renderers}
173173

174-
React was originally created for the DOM but it was later adapted to also support native platforms with [React Native](http://facebook.github.io/react-native/). This introduced the concept of "renderers" to React internals.
174+
React was originally created for the DOM but it was later adapted to also support native platforms with [React Native](https://facebook.github.io/react-native/). This introduced the concept of "renderers" to React internals.
175175

176176
**Renderers manage how a React tree turns into the underlying platform calls.**
177177

0 commit comments

Comments
 (0)