learn-orbi-web-game-developer-tic-tac-toe

Codes for jogo da velha (tic tac toe) - Órbi Web Games Developer bootcamp at DIO._ (inital version).

|Note1 check the available branches: they are numbered and each one presents an incremental update (check also the Todo section for details)

|Note2 the main branch always reflects the latest version

Instructions

Play the game

maxdevjs.github.io/learn-orbi-web-game-developer-tic-tac-toe

How to play

Click on the preferred square.

Credits

Original author

Jogo da Velha (ruschoni02/jogo-da-velha)

Resources

• Git: Merge Branch into Master

TODO

• refactor code 😙

• make it responsive 😙

• initial code: 00-initial

• basic cosmetic css 01-basic-css-cosmetic

  • rounded corners
  • box-shadow
  • text-shadow
  • background linear-gradient()
    • Extra scrollbar when body height is 100vh
  • add GitHub Corners to link to the repo from the demo page

• sound effects 🎶🎸 02-sound-effects

  • solve Autoplay is only allowed when approved by the user, the site is activated by the user, or media is muted.
    • temporarily solved with a modal
    • check:
      • Autoplay guide for media and Web Audio APIs
      • How to play MP3 in the background music automatically?

• shake effect on click in an already clicked square

• win effect 🎉

• initial instructions screen (instead of playing straight and with no clues about how to play). Perhaps, very unikely 😴

  • autoplay? Why not... 🤔😈

• pause? 🤔

• animations 🎬

  • CSS Animations?
  • gsap?
  • zimjs?

• Canvas API version 🤯

• Socket.IO version 🤪

  • The WebSocket API (WebSockets)
  • Writing WebSocket client applications
  • WebSocket