Loading...
アイコン

Code With Bubb

チャンネル登録者数 6.03万人

5732 回視聴 ・ 86いいね ・ 2022/10/05

Code a Tic-tac-toe game with ONLY JavaScript

In this project, I'll show you how to make a tic tac toe game using JavaScript.

00:00 Intro
00:24 Dynamically Creating a title
03:23 Global state
05:08 Game board element & squares
09:48 CSS classes
13:33 Events
18:26 Game win
24:23 End screen
33:27 Resetting the game

Live demo: codepen.io/codebubb/pen/GRdBXXx

So in this beginner JavaScript tutorial, we'll be looking at the classic tic tac toe game and how to code this using only JavaScript.

There are a lot of great tutorials out there which show you how to code a tic tac toe game but they usually focus on creating the elements on the page, the HTML markup, for the game and also styling the game with a CSS stylesheet.

This tutorial is different. We won't create any markup in the HTML file, and whilst we will create a few CSS classes to use, I'll show you how these are optional. The main focus of this tutorial is how to create HTML elements on the page using JavaScript and also how to apply styles to them as well.

Of course, we'll still be having fun coding up our tic tac toe game as well so we'll take a look at how to create a working game including checking for when a player has won or if it's a draw.

#javascript #javascriptproject #javascriptbeginners Channel Handle @codebubb

コメント

コメントを取得中...

コントロール
設定

使用したサーバー: direct