Build A Speed Typing Game With NodeJS - Tutorial

In this video you will lean how to create a fun speed typing game. Each time the user refreshes the page they will be presented with a new word sequence, generated at random from a list of the 3000 most commonly used words in the English language. They will then have one minute to accurately type out as many words from this list as they can. When the time is up their WPM (words per minute) will be calculated and then shown on the screen. This video will be perfect for you, if you are looking for a fun little project that you can use to train your JavaScript and Node JS (Express) skills.

It should be mentioned that other people have created similar style speed typing games on YouTube before me, however my game works slightly different to theirs. Other then cosmetic differences, the word sequences in my game are not coherent sentences unlike their version, where the user is presented with a coherent paragraph which they have to type out verbatim. Mine isn’t like this, it instead focuses more on typing out the individual words correctly rather then one big paragraph. This is because I do not generate paragraphs, instead I generate a list of randomly selected words from the English language. The user then has to type out as many of these words accurately as they can. But no coherent sentences are formed (unless by chance) and no punctuation is used. The words are presented on their own.

The other distinction between my tutorial and other tutorials that may have already been submitted to YouTube is the fact that I connect a backend to my project. I do not use a pre-existing API which gives me a random paragraph. Instead I create the backend on my own using NodeJS and the Express framework. As for the word store, that comes from a SQL database which contains the 3000 most commonly used English words, this is all set up during the tutorial.

? Materials/References:

The 3000 most common English words: https://www.ef.co.uk/english-resources/english-vocabulary/top-3000-words/
XAMMP: https://www.apachefriends.org/index.html
Nodemon: https://www.npmjs.com/package/nodemon *It is important that you install this globally.


? Concepts Covered:

- How to transfer the content of a txt file into a SQL database which has the appropriate structure for the content of the txt file. The individual data entries in the txt file are separated by a line break. In NodeJS we use regular expressions to isolate the individual words so that they can be assigned to their own row on the SQL table.
- Use EJS (JavaScript Templating) to render out a HTML document with an Array. The values of this Array are then rendered with the HTML DOM and each value is rendered inside its own HTML element via a ‘forEach’ loop.
- Detect when a line of text ends and another one begins when the number of words of each line varies due to differences in word length.
- Use the ‘keyCode’ in JavaScript to detect what key the user has specifically pressed and to perform certain logic on targeted key presses.

? Technologies used:

- NodeJS
- Express
- JavaScript & CSS
- EJS
- MySQL (Interfaced with PHPMyAdmin)

If you enjoyed this video then please consider liking ? and subscribing. You would be doing me a huge favour if you did this and it would be greatly appreciated ❤️ by me. Likewise, if you have any queries or comments that you want answered. Then please, don’t hesitate post them down into the comments box below. I would love to hear back from you and will answer all of your questions to


the best of my ability. Stay awesome guys. Peace and love. ☮️❤️


KEYWORDS


qixotl_lfc,Qixotl,LFC,typing test tutorial,web dev project,node js project,how to make a speed typing game in JavaScript,JavaScript Typing Test,Typing test web dev,Node JS typing test,ejs node js express,ejs game,ejs project,ejs loop render variable,javascript gamedev,javascript game tutorial,javascript games for beginners,mysql node js express,javascript typing effect,javascript typing animation,javascript typing game,javascript typing test,mysql ejs,POST