Build a Typing Speed Test with JavaScript and CSS

2h 26m 45s
English
Paid

Course description

Do you want to enhance your JavaScript skills with a truly engaging project? In this course, you will create a fully interactive typing speed test application that checks the speed and accuracy of typing within a limited time frame.

You will dive into key aspects of frontend development: working with the DOM in real-time, event handling, timer management — all while creating an application you can showcase or even use to compete with friends. You will also master responsive design and simple yet effective error handling for stable interface operation.

This project is not just a typing trainer, but a practical way to boost your confidence and understand how interactive web applications really work.

Watch Online

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 15 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Introduction

All Course Lessons (15)

#Lesson TitleDurationAccess
1
Introduction Demo
03:11
2
Main UI
10:40
3
Shuffle & Generate Text JS
10:47
4
Keyboard Input JS (Part 1)
14:50
5
Keyboard Input JS (Part 2)
06:36
6
Timer & Calculate Score JS
13:44
7
Reset Test JS
10:50
8
Introduction
05:02
9
Mac / Linux Device Setup
05:35
10
Windows Device Setup
06:58
11
VSCode Setup & Template
19:27
12
VSCode Extensions
09:11
13
DevTools
13:57
14
GitHub
14:34
15
Let's Keep Learning Together!
01:23

Unlock unlimited learning

Get instant access to all 14 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Comments

0 comments

Want to join the conversation?

Sign in to comment

Similar courses

Build a Monthly Spending Tracker with HTML, JavaScript and CSS

Build a Monthly Spending Tracker with HTML, JavaScript and CSS

Sources: zerotomastery.io
Master front-end development skills by creating an expense-tracking application using HTML, JavaScript, and CSS. A dynamic interface and Chart.js...
2 hours 26 minutes 14 seconds
Full-Stack Tao

Full-Stack Tao

Sources: Alex Kondov
Software development is not only about creating new features, but also about writing code that retains its value over time and remains flexible to changes.
Generating Fake Data with Faker.js

Generating Fake Data with Faker.js

Sources: vueschool.io
Every user application depends on data, whether it's user profiles, product listings, or blog posts. However, creating realistic datasets...
51 minutes 56 seconds
Build a Dynamic Data Table using JavaScript, CSS, and APIs

Build a Dynamic Data Table using JavaScript, CSS, and APIs

Sources: zerotomastery.io
Learn to create interactive tables using JavaScript and APIs. Master asynchronous requests and design a responsive interface to enhance your skills.
3 hours 7 minutes 5 seconds