Typing Speed Test App Using Django Framework

Project Overview

The Typing Speed Test project is a web-based application built using the Django framework. It allows users to test their typing speed (WPM) and accuracy by typing a given passage within a timed session. The app tracks performance metrics, stores results, and provides leaderboards for comparison.

Screenshots

Key Features

1. User Authentication
- Secure login and registration system using Django’s built-in auth.
- Role-based user management (supports users and admins).
- Session-based authentication to protect test and result pages.
2. Typing Test Functionality
- Interactive typing interface with real-time input tracking.
- Timer starts automatically when user begins typing.
- Calculates Words Per Minute (WPM) and accuracy dynamically.
- Difficulty modes (Easy / Medium / Hard) for flexible challenge levels.
- Auto-submits results upon completion for accurate time tracking.
3. Result Analysis
- Detailed result summary page showing:
  - Words per minute (WPM)
  - Accuracy percentage
  - Time taken
  - Difficulty level
- Progress bar visualization for accuracy.
- Option to retry test or view leaderboard instantly.
4. Leaderboard
- Displays top performers based on WPM and accuracy.
- Shows username, WPM, accuracy, and date of completion.
- Highlights average WPM of all users.
- Responsive and mobile-friendly leaderboard table.
5. My History
- Personalized dashboard for users to track their typing progress.
- Displays each user’s past test results with date and difficulty.
- Encourages improvement through performance tracking.
6. Modern & Responsive UI
- Clean Bootstrap 5 design with smooth layout and color palette.
- Uniform styling across all pages (home, test, result, leaderboard, history).
- Mobile-friendly and accessible interface.
7. Data Management & Storage
- Uses SQLite (default) or any Django-supported database.
- Stores test results with timestamp, WPM, accuracy, and difficulty.
- Automatically links results to authenticated users.
8. Security
- CSRF protection on all forms.
- Uses Django’s secure authentication and session framework.
- Prevents unauthorized access to user data and results.

Functionality

User Registration & Login
- New users can register with username, email, and password.
- Registered users can log in securely using Django’s authentication system.
- Logout functionality to end the session safely.
Typing Test Module
- Displays a random passage for the user to type.
- Automatically starts the timer when the user begins typing.
- Calculates:
  - Typing Speed (Words Per Minute – WPM)
  - Typing Accuracy (%)
  - Time Taken (in seconds)
Difficulty Levels
- Users can choose typing passages based on difficulty:
  - Easy
  - Medium
  - Hard
Result Display
- Shows user’s performance immediately after the test:
  - WPM
  - Accuracy
- Time taken
- Option to retake the test.
Result Storage
- Each test result (WPM, accuracy, time, difficulty) is saved in the database.
- Linked to the logged-in user account.
User History
- Displays all previous test results of the logged-in user.
- Results are listed with date and difficulty level.
Leaderboard
- Shows top-performing users based on WPM.
- Displays rank, username, accuracy, and date.
Admin Panel
- Admin can manage users and results via Django’s admin dashboard.
- Can delete, edit, or view all records.
Responsive Interface
- Clean and mobile-friendly UI using Bootstrap.
- Works seamlessly across devices and browsers.
Automatic Timing & Calculation
- Time starts when user focuses on typing box.
- Time ends upon clicking “Finish.”
- WPM and Accuracy calculated automatically in the backend.

Technology Stack

Python: Chosen for its simplicity, readability, and integration with Django.
Django Framework: Handles URL routing, ORM (database queries), authentication, and templating efficiently.
SQLite3: Default lightweight database suitable for local and small-to-medium projects.
HTML5: For structuring the web pages and displaying content.
CSS3: Adds visual design, layout, and responsiveness to pages.
Bootstrap 5: Ensures responsive, mobile-friendly, and professional interface quickly.
JavaScript (ES6): Handles timing, typing event tracking, and dynamic form submission without reload.