reactjs / reactjs/react.dev

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

Aberta
#7,040 3 comentários 0 reações 0 responsáveis Ver no GitHub

Ninguém assumiu esta issue ainda.

type: documentation
Linguagem predominante
JavaScript
Estrelas
11.8k
Forks
7.9k
Merge médio
1d 11h
PRs com merge (30d)
11

Descrição

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.

Guia de contribuição

Abrir o guia de contribuição

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Direção de pesquisa

Abra o tutorial de Tic-Tac-Toe em https://react.dev/learn/tutorial-tic-tac-toe e revise os exemplos de Board, Square e styling. Atualize a demo para gerar quadrados com map e demonstrar key, usar uma grade de três colunas e delegar os cliques ao contêiner pai; o tutorial deve continuar compreensível e funcional.

Escrita pelo modelo de indexação a partir do texto da issue.

Avaliação

Stack de tecnologia
javascript, react
Domínio
documentation, frontend
Tipo de issue
Refatoração
Dificuldade
3/5
Tempo estimado
1-2 dias
Status de atividade
Estagnada
Clareza
Razoavelmente clara
Facilidade para iniciantes
45/100

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.