Este Mini Projeto é um excelente desafio prático para fortalecer nossas habilidades em HTML, CSS e JavaScript na construção de um jogo da velha.

🤓 Antes de começar

O projeto já possui uma estrutura inicial pronta para você na branch principal do repositório, que inclui todas as imagens essenciais para o desenvolvimento no diretório /assets. Sinta-se à vontade para replicar o nosso layout sugerido ou incluir novas imagens no projeto.

🔨 Requisitos

• Desenvolva a aplicação utilizando HTML, CSS e JS.
• Crie uma tela inicial para exibir o layout básico do Jogo da Velha.
• Permita que o jogador escolha entre X e O.
• Crie uma lógica para alternar entre os jogadores X e O a cada jogada.
• Crie uma lógica para verificar se houve vencedor ou empate.
• Crie uma lógica para reiniciar o jogo após o fim de uma partida.

👀 Dicas:

• Busque quebrar os problemas em pedaços menores.
• Evite repetição de código desnecessária.
• Separe sua lógica em funções isoladas.
• Use e abuse do console.log para entender o que está acontecendo no seu código.

🔨 Desafio extra para quem quer ir além

• Crie um checkbox com o texto Mostrar eventos que seja capaz de exibir ou ocultar o registro de ações do usuário na partida.
• Exiba um alerta com o resultado da partida ao final de cada jogo.

🎨 Design Sugerido

Temos uma sugestão de design no Figma. Entretanto, fique à vontade para montar a aplicação conforme a sua criatividade.

Figma

🔗 Link do design

👉🏽 Sobre esse mini-projeto

O que você irá praticar:

Javascript

• Manipulação de elementos HTML utilizando JavaScript.
• Manipulação de classes CSS utilizando JavaScript.
• Arrays e objetos em JavaScript.
• Eventos em JavaScript.

HTML e CSS

• Manipulação de elementos HTML
• Layout e design básicos em CSS