|
1 | 1 | ---
|
2 |
| -title: "Introducing the New React DevTools" |
| 2 | +title: "Introduciendo las nuevas React DevTools" |
3 | 3 | author: [bvaughn]
|
4 | 4 | ---
|
5 |
| -We are excited to announce a new release of the React Developer Tools, available today in Chrome, Firefox, and (Chromium) Edge! |
| 5 | +Nos complace anunciarles una nueva liberación de las Herramientas de Desarrollo de React (*React DevTools*), disponible hoy en Chrome, Firefox y (Chromium) Edge! |
6 | 6 |
|
7 |
| -## What's changed? |
| 7 | +## ¿Qué Cambió? |
8 | 8 |
|
9 |
| -A lot has changed in version 4! |
10 |
| -At a high level, this new version should offer significant performance gains and an improved navigation experience. |
11 |
| -It also offers full support for React Hooks, including inspecting nested objects. |
| 9 | +¡Mucho ha cambiado en la versión 4! |
| 10 | +A un alto nivel, esta versión debería ofrecer ganancias significativas de rendimiento y una experiencia de navegación mejorada. |
| 11 | +También ofrece soporte completo para los Hooks de React, incluyendo la inspección de objetos anidados. |
12 | 12 |
|
13 |
| - |
| 13 | + |
14 | 14 |
|
15 |
| -[Visit the interactive tutorial](https://react-devtools-tutorial.now.sh/) to try out the new version or [see the changelog](https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md#400-august-15-2019) for demo videos and more details. |
| 15 | +[Visite el tutorial interactivo](https://react-devtools-tutorial.now.sh/) para probar la nueva versión o [vea la bitácora de cambios](https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md#400-august-15-2019) para videos de demostración y más detalles. |
16 | 16 |
|
17 |
| -## Which versions of React are supported? |
| 17 | +## ¿Cuáles versiones de React son soportadas? |
18 | 18 |
|
19 | 19 | **`react-dom`**
|
20 | 20 |
|
21 |
| -* `0`-`14.x`: Not supported |
22 |
| -* `15.x`: Supported (except for the new component filters feature) |
23 |
| -* `16.x`: Supported |
| 21 | +* `0`-`14.x`: No soportada |
| 22 | +* `15.x`: Soportada (excepto por la nueva funcionalidad de filtrar componentes) |
| 23 | +* `16.x`: Soportada |
24 | 24 |
|
25 | 25 | **`react-native`**
|
26 |
| -* `0`-`0.61`: Not supported |
27 |
| -* `0.62`: Will be supported (when 0.62 is released) |
| 26 | +* `0`-`0.61`: No soportada |
| 27 | +* `0.62`: Será soportada (cuando 0.62 sea liberada) |
28 | 28 |
|
29 |
| -## How do I get the new DevTools? |
| 29 | +## ¿Cómo obtengo las nuevas DevTools? |
30 | 30 |
|
31 |
| -React DevTools is available as an extension for [Chrome](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) and [Firefox](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/). |
32 |
| -If you have already installed the extension, it should update automatically within the next couple of hours. |
| 31 | +React DevTools está disponible como una extensión para [Chrome](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) y [Firefox](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/). |
| 32 | +Si ya instalaste la extensión, debería actualizarse de forma automática dentro de un par de horas. |
33 | 33 |
|
34 |
| -If you use the standalone shell (e.g. in React Native or Safari), you can install the new version [from NPM](https://www.npmjs.com/package/react-devtools): |
| 34 | +Si usas el shell independiente (ej. en React Native o Safari), puedes installar la nueva versión [desde NPM](https://www.npmjs.com/package/react-devtools): |
35 | 35 |
|
36 | 36 | ```shell
|
37 | 37 | npm install -g react-devtools@^4
|
38 | 38 | ```
|
39 | 39 |
|
40 |
| -## Where did all of the DOM elements go? |
| 40 | +## ¿A dónde se fueron todos los elementos del DOM? |
41 | 41 |
|
42 |
| -The new DevTools provides a way to filter components from the tree to make it easier to navigate deeply nested hierarchies. |
43 |
| -Host nodes (e.g. HTML `<div>`, React Native `<View>`) are *hidden by default*, but this filter can be disabled: |
| 42 | +Las nuevas DevTools proveen una forma de filtrar los componentes del árbol para hacer más fácil navegar en jerarquías profundamente anidadas. |
| 43 | +Los nodos anfitriones (ej. HTML `<div>`, React Native `<View>`) están *ocultos por defecto*, pero este filtro puede ser deshabilitado: |
44 | 44 |
|
45 |
| - |
| 45 | + |
46 | 46 |
|
47 |
| -## How do I get the old version back? |
| 47 | +## ¿Cómo obtengo de nuevo la versión anterior? |
48 | 48 |
|
49 |
| -If you are working with React Native version 60 (or older) you can install the previous release of DevTools from NPM: |
| 49 | +Si estás trabajando con React Native version 60 (o anterior) puedes instalar la versión anterior de DevTools desde NPM: |
50 | 50 |
|
51 | 51 | ```shell
|
52 | 52 | npm install --dev react-devtools@^3
|
53 | 53 | ```
|
54 | 54 |
|
55 |
| -For older versions of React DOM (v0.14 or earlier) you will need to build the extension from source: |
| 55 | +Para versiones anteriores de React DOM (v0.14 o previas) necesitarás compilar la extensión desde el código fuente: |
56 | 56 |
|
57 | 57 | ```shell
|
58 |
| -# Checkout the extension source |
| 58 | +# Haz Checkout del código fuente de la extensión |
59 | 59 | git clone https://github.com/facebook/react-devtools
|
60 | 60 |
|
61 | 61 | cd react-devtools
|
62 | 62 |
|
63 |
| -# Checkout the previous release branch |
| 63 | +# Haz Checkout de la rama de la versión anterior |
64 | 64 | git checkout v3
|
65 | 65 |
|
66 |
| -# Install dependencies and build the unpacked extension |
| 66 | +# Instala las dependencias y compila la extensión |
67 | 67 | yarn install
|
68 | 68 | yarn build:extension
|
69 | 69 |
|
70 |
| -# Follow the on-screen instructions to complete installation |
| 70 | +# Sigue las instrucciones en pantalla para completar la instalación |
71 | 71 | ```
|
72 | 72 |
|
73 |
| -## Thank you! |
| 73 | +## ¡Gracias! |
74 | 74 |
|
75 |
| -We'd like to thank everyone who tested the early release of DevTools version 4. |
76 |
| -Your feedback helped improve this initial release significantly. |
| 75 | +Nos gustaría agradecer a todos que hicieron pruebas de la liberación temprana de DevTools versión 4. |
| 76 | +Su feedback nos ayudó a mejorar esta liberación inicial de manera significativa. |
77 | 77 |
|
78 |
| -We still have many exciting features planned and feedback is always welcome! |
79 |
| -Please feel free to open a [GitHub issue](https://github.com/facebook/react/issues/new?labels=Component:%20Developer%20Tools) or tag [@reactjs on Twitter](https://twitter.com/reactjs). |
| 78 | +¡Aún tenemos muchas funcionalidades emocionanetes planificadas y el feedback es siempre bienvenido! |
| 79 | +Sientanse libres de abrir un [reporte en GitHub](https://github.com/facebook/react/issues/new?labels=Component:%20Developer%20Tools) o etiquetar [@reactjs en Twitter](https://twitter.com/reactjs). |
0 commit comments