Build your own Vanilla JavaScript Game!

preview_player
Показать описание
In this video, we’ll build out a Tic Tac Toe game from scratch using only HTML, CSS, and vanilla JavaScript

🔗 Key Links 🔗

---------------------------------------

⏲️ Timestamps ⏲️
0:00 Introduction
0:23 Project setup
6:07 Styling the game board
13:20 Game functionality
25:11 Change color on turn
27:55 Adding hover states
32:35 Improve winning function
36:54 Improve hover and focus states
38:56 Adding confetti

---------------------------------------
🎨 VSCode Theming

---------------------------------------

🌐 Connect With Me 🌐
  1. Coding in Public
Рекомендации по теме
Build your own 0:41:21

Build your own Vanilla JavaScript Game!

How to make 0:13:49

How to make your own Vanilla-JavaScript/TypeScript components!

How I'd Learn 0:06:55

How I'd Learn Web Development (If I Could Start Over)

Vanilla JS: You 0:30:28

Vanilla JS: You Might Not Need that Library - Maximiliano Firtman

Should I build 0:10:23

Should I build my application with vanilla Javascript?

Creating an SPA 0:03:42

Creating an SPA Router in Vanilla JS

Build 15 JavaScript 8:23:57

Build 15 JavaScript Projects - Vanilla JavaScript Course

Create a Dynamic 0:05:32

Create a Dynamic Web Component Using Vanilla JS | Code Challenge #1

How to create 0:17:45

How to create a Web Component using Vanilla JS

Vanilla JavaScript with 0:48:22

Vanilla JavaScript with Chris Ferdinandi

Learn vanilla JS 0:13:57

Learn vanilla JS in about 10 minutes

Refactoring a vanilla 0:40:18

Refactoring a vanilla JS app with state-based UI

Build 5 Javascript 6:29:16

Build 5 Javascript Projects (HTML5 + CCS3 + Vanilla JS) | Javascript Crash Course

Framework Free - 0:29:04

Framework Free - Functional HTML Rendering and State Management in Vanilla JS - Drew Warren

Build a Stunning 0:00:11

Build a Stunning Landing Page with HTML, CSS & JavaScript

I built the 0:21:58

I built the same app 10 times // Which JS Framework is best?

Build Your First 0:13:55

Build Your First Javascript Library (Like jQuery!)

Build a Single 0:37:40

Build a Single Page Application with JavaScript (No Frameworks)

This JavaScript library 0:00:18

This JavaScript library will make your websites look MUCH better. #technology #programming

The easiest way 0:00:25

The easiest way to start your own blog using vanilla JS on April 1st

Building a Productivity 0:42:52

Building a Productivity App in Vanilla Javascript

How To Make 0:13:12

How To Make Vanilla JavaScript Reactive Like a Framework

Converting jQuery to 0:12:24

Converting jQuery to vanilla JS

Create Inmutable Objects 0:00:26

Create Inmutable Objects in Vanilla Javascript 🤯

Комментарии
Автор

Building games are always fun. I love the pure html and csa setup. Very valuable to learn that way.

FilledStacks
Автор

Very fun. I enjoy doing these types of projects just to relax.

soundrightmusic
Автор

Amazing
Looking forward to more of such tutorials
Thank You so much

AjayKasthala
Автор

Now I get where the target vs currentTarget video inspiration came from!

FromagioCristiano
Автор

Yeah!!!!
Thanks, man!
Abraço do Brasil!

viniciusm.m.
Автор

Great video!, learn lots of intresting technique here. For the creation of the tiles, I wonder why we do we need to create an empty string, repeat it, convert it to an array and convert it back to an string? When we can simply

const button = '<button class="tile"></button>'
const buttons = button.repeat(9)

Is there something I'm missing?

lesliehui
Автор

If there was a draw would you make a draw condition similar to win coniditions where you have an array with the tiles 0--8 filled?

TheChosenmega
Автор

if at the level on codewars, what is the number for this project? i think the tic ta toe project has a difficult logic

mydaily
Автор

How are you able to console.log so quickly. Are you using any extension for it?

faxec
join shbcf.ru