Programming · JavaScript
Build a typing speed tester
Show a passage, time the user typing it and report words per minute and accuracy.
- DifficultyEasy
- Estimated time2–7 days
- Budget₹0
- ClassClass 9–12
- TeamSolo
- You needComputer only
Prerequisites: None beyond your class work
Original · by TechnifyedGameWeb AppBeginner friendlyFree to doComputer onlyPortfolio focused
Overview
Show a passage, time the user typing it and report words per minute and accuracy.
Skills you will use
Materials and tools
- Computer with a browser and a text editor
Tools and software
Step-by-step roadmap
Start
You will finish with: a web page that measures typing speed and keeps the best score in the browser.
- 1
Prerequisites
Nothing special to know first. Then collect the 1 item in the materials list.
- 2
Learn
Read up on javascript: DOM, events, timers. Your textbook chapter and one short video are enough.
- 3
Plan
List the features for version one, sketch the screens or data flow and pick the tools. Keep the first version small.
- 4
Build
- Display a random passage from a list.
- Start a timer on the first key press.
- Highlight correct and wrong characters as the user types.
- Stop when the passage is complete.
- Calculate words per minute and accuracy and show them.
- 5
Test
Try it with wrong, empty and unusual input, and ask someone else to use it without your help.
- 6
Document
Write a README: what it does, how to run it, screenshots and what you learned. Report structure
- 7
Present
Show a live demo of one complete task, then the design and the hardest problem you solved. Presentation structure
- 8
Publish
Put the code on GitHub with the README and, if you can, deploy a live demo.
Expected outcome
A web page that measures typing speed and keeps the best score in the browser.
Other versions of this project
Advanced version
Add difficulty levels and a chart of progress over time.
Ways to do this project
Text marked "You write this" is a prompt for your own work; everything else is specific to this project.
Use this as the outline of your README or case study.
- Problem
- You write thisThe problem in one or two sentences.
- Why it matters
- You write thisWho has this problem and what it costs them.
- What was built
- A web page that measures typing speed and keeps the best score in the browser.
- Technology
- CSS, HTML, JavaScript
- Architecture
- You write thisOne diagram: the parts and how data moves between them.
- Implementation
- You write thisThe 5 build steps in your own words, with one code or design decision you are proud of.
- Challenges
- You write thisThe hardest bug or decision, and how you got past it.
- Results
- You write thisNumbers: accuracy, speed, users, survey answers.
- Demo and code
- You write thisA link to a live demo or a short video, and to the GitHub repository.
- Lessons learned
- You write thisWhat you would do differently next time.
- Future improvements
- Add difficulty levels and a chart of progress over time.
- Problem
- Show a passage, time the user typing it and report words per minute and accuracy.
- Target user
- You write thisOne specific person: who they are and when they would use this.
- Solution
- Show a passage, time the user typing it and report words per minute and accuracy.
- First version (MVP)
- You write thisThe smallest version that shows the idea working once, end to end.
- Tech stack
- CSS, HTML, JavaScript
- Architecture
- You write thisA quick sketch of the parts and how they connect.
- Demo
- You write thisThe one scenario you will show live, start to finish, in under two minutes.
- Stretch goals
- Add difficulty levels and a chart of progress over time.
Team roles
Plan by length
24-hour
- Hours 0–2: agree the problem, the user and the one thing the demo must show
- Hours 2–16: build only the first version
- Hours 16–20: test the demo path end to end and fix what breaks
- Hours 20–24: slides, a 2-minute demo script and a backup recording
48-hour
- Evening 1: problem, user, sketch and task split
- Day 1: first version working end to end
- Day 2 morning: one stretch goal and testing
- Day 2 afternoon: polish, slides and demo practice
1-week
- Day 1: research the problem and talk to two possible users
- Days 2–4: first version
- Day 5: stretch goals
- Day 6: testing and write-up
- Day 7: demo video and presentation
Report and presentation
Report structure
- Title and summary
- Problem and target user
- Features
- Tools and technology
- Design: architecture, data model or screens
- Implementation
- Testing
- Results and screenshots
- Challenges
- Future improvements
- References
Presentation structure
- The problem
- Who it is for
- Live demo
- How it is built (one diagram)
- The hardest part
- Testing and results
- What you learned
- What comes next
Viva questions
Prepare your own answers to these before you present.
- What is the aim of your project, in one sentence?
- What is the principle behind it?
- Why did you choose these materials or tools?
- What result did you get, and was it what you expected?
- What went wrong and how did you fix it?
- How could this be improved or used in real life?
Resources
Source and attribution
Original
Written by Technifyed. Free to use for your own school or college project; write the report in your own words. Added 1 Oct 2026.
Similar projects
More Programming projects
Programming · JavaScript
Build a multiplayer tic-tac-toe with an unbeatable computer
Make tic-tac-toe for two players, then add a computer that never loses.
Programming · Python
Build a Snake game
Program the classic Snake with scoring, growing length and game over.
Programming · Python
Make a to-do list app that saves to a file
Build a command-line task manager that adds, completes, deletes and saves tasks between runs.
Programming · Python
Automate a boring task with a script
Write a script that renames and sorts a messy folder of files by type and date.
Same tools
Software Development · Frontend
Make a personal portfolio website
Design and publish a fast, mobile-friendly site that shows who you are and what you have built.
EdTech and Study Tools · Educational Websites
Make an educational website for a school topic
Build a small site that teaches one chapter with text, diagrams and a quiz.
Software Development · APIs
Build a weather app using a public API
Show current weather and a five-day forecast for any city using a free weather API.
Software Development + EdTech and Study Tools
Make a quiz web app with a leaderboard
Build a timed quiz site for your class with a live leaderboard.
Two-subject alternatives
Pure Mathematics + Programming
Visualise fractals with code
Draw the Koch snowflake, Sierpinski triangle and Mandelbrot set and measure a fractal dimension.
Pure Mathematics + Programming
Map your school as a graph and find shortest paths
Model corridors and rooms as a graph and find the fastest route between any two rooms.
Physics + Programming
Simulate projectile motion with air drag in Python
Plot real trajectories with air resistance and compare them with the textbook parabola.
Music, Theatre and Writing + Programming
Create generative art with code
Write programs that draw a different artwork every time they run and curate a series of ten.
Same difficulty and budget
Artificial Intelligence · NLP
Build a rule-based chatbot for school FAQs
Answer common questions about your school with keyword matching and a fallback reply.
Programming · Python
Build a calculator with a graphical interface
Make a desktop calculator with buttons, a display and keyboard support.
Cybersecurity + Pure Mathematics
Implement classic ciphers and break them
Write Caesar and substitution ciphers, then crack them with frequency analysis.
Cybersecurity · Authentication
Build a password strength checker
Score a password's strength, explain why, and estimate how long it would take to guess.