reactjs / reactjs/react.dev

[Suggestion]: Improve code in Tic-Tac-Toe demo

Abierto
#7,040 3 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

type: documentation
Lenguaje dominante
JavaScript
Estrellas
11.8k
Forks
7.9k
Merge medio
1 d 11 h
PR fusionados (30 d)
11

Descripción

Summary

I believe there's a good scope to improve the code in the Tic-Tac-Toe example here.

Page

https://react.dev/learn/tutorial-tic-tac-toe

Details
  • The Board component returns the Square component statically. This could instead be returned dynamically using the map method. This will also be a good way to demonstrate the key prop.
  • Talking about the styling, instead of defining a board-row class that puts each box in a row, we can instead use a grid container with 3 columns and fit-content width.
  • Instead of attaching a click listener to each box, the click event handling can be delegated to the parent container.

Guía de contribución

Abrir la guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Línea de trabajo

Abre el tutorial de Tic-Tac-Toe en https://react.dev/learn/tutorial-tic-tac-toe y revisa los ejemplos de Board, Square y styling. Actualiza la demo para que genere cuadrados con map y demuestre key, use una cuadrícula de tres columnas y delegue los clics al contenedor padre; el tutorial debe seguir siendo comprensible y funcional.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
javascript, react
Área
documentation, frontend
Tipo de issue
Refactorización
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
45/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.