diff --git a/src/content/learn/tutorial-tic-tac-toe.md b/src/content/learn/tutorial-tic-tac-toe.md index 72f4e4f1e..3ec2772bb 100644 --- a/src/content/learn/tutorial-tic-tac-toe.md +++ b/src/content/learn/tutorial-tic-tac-toe.md @@ -4,7 +4,7 @@ title: 'Tutorial: Tres en línea' -En este tutorial construirás un pequeño juego de Tres en linea. Este tutorial no asume ningún conocimiento previo de React. Las técnicas que aprenderás en el tutorial son fundamentales para crear cualquier aplicación de React, y comprenderlas por completo te dará una comprensión profunda de React. +En este tutorial construirás un pequeño juego de Tres en línea. Este tutorial no asume ningún conocimiento previo de React. Las técnicas que aprenderás en el tutorial son fundamentales para crear cualquier aplicación de React, y comprenderlas por completo te dará una comprensión profunda de React. @@ -346,7 +346,7 @@ Las líneas 1-5 reúnen todas las piezas necesarias: El resto del archivo reúne todas las piezas e inyecta el producto final en `index.html` en la carpeta `public`. -### Construyendo el tablero {/*building-the-board*/} +### Construir el tablero {/*building-the-board*/} Volvamos a `App.js`. Aquí es donde pasarás el resto del tutorial. @@ -415,9 +415,9 @@ export default function Square() { } ``` -El CSS definido en `styles.css` diseña los `div`s con `className` de `board-row`. Ahora que agrupaste tus componentes en filas con el estilo `div`s, tienes un tablero de tres en linea: +El CSS definido en `styles.css` diseña los `div`s con `className` de `board-row`. Ahora que agrupaste tus componentes en filas con el estilo `div`s, tienes un tablero de tres en línea: -![El tablero de Tres en linea esta lleno con números del 1 al 9](../images/tutorial/number-filled-board.png) +![El tablero de Tres en línea esta lleno con números del 1 al 9](../images/tutorial/number-filled-board.png) Pero ahora tienes un problema. Tu componente llamado `Square`, en realidad ya no es un cuadrado. Arreglemos esto cambiando el nombre a `Board`: @@ -621,7 +621,7 @@ export default function Board() { Ahora deberías ver una cuadrícula de números nuevamente: -![tablero de Tres en linea lleno de números del 1 al 9](../images/tutorial/number-filled-board.png) +![tablero de Tres en línea lleno de números del 1 al 9](../images/tutorial/number-filled-board.png) Tu código actualizado debería verse así: @@ -702,7 +702,7 @@ body { -### Haciendo un componente interactivo. {/*making-an-interactive-component*/} +### Hacer un componente interactivo. {/*making-an-interactive-component*/} Rellenemos el componente `Square` con una `X` al hacer clic en él. Declara una función llamada `handleClick` dentro del `Square`. Luego, agrega `onClick` a las props del elemento `