Build Typing Game with Javascript

Опубликовано: 25 Ноябрь 2024
на канале: Coding With Dawid

19,058

645

In this tutorial we will build a speed typing game!
This is a nice game to play to improve typing speed and learn touch typing.

I try to go in detail with everything so this project should be easy even for beginners. You will learn many useful things like key detection, moving objects on the screen and many others.

Source code: https://github.com/dejwid/js-typing-game

TIMESTAMPS:
00:00:00 - Intro
00:00:25 - html structure and basic css for our app
00:08:48 - inserting random words to our game
00:17:44 - focus warning
00:21:22 - keyboard typing event
00:27:30 - adding blinking cursor
00:30:35 - handling letters typing
00:34:49 - handling space key
00:44:48 - extra wrong letters at the end of a word
00:47:04 - moving the blinking cursor
00:53:56 - handling backspace
01:02:33 - scrolling lines of words
01:08:39 - game timer (countdown)
01:16:39 - handling game’s end screen
01:22:44 - showing word per minute result
01:33:54 - new game button
01:34:58 - Outro