Skip to content

Latest commit

 

History

History
255 lines (180 loc) · 7.42 KB

File metadata and controls

255 lines (180 loc) · 7.42 KB

TypeMaster - Advanced Typing Speed Test Application

TypeMaster License HTML5 CSS3 JavaScript Firebase

🎯 Overview

TypeMaster is a comprehensive, feature-rich typing speed test application designed to help users improve their typing skills through various game modes, real-time analytics, and personalized feedback. Built with vanilla JavaScript and Firebase, it offers a modern, responsive interface with multiple customization options.

✨ Key Features

🎮 Multiple Game Modes

  • Timed Test - Race against the clock (30s, 60s, 2min, 5min, or custom)
  • Survival Mode - Continue until max mistakes or time runs out
  • AI Practice - Personalized practice based on your weaknesses
  • Prediction Challenge - Type predicted text to improve flow
  • Numbers Only - Practice typing numbers and special characters
  • Curriculum - Structured lessons for systematic improvement

📊 Advanced Analytics

  • Real-time Stats - WPM, accuracy, correct/incorrect words, keystrokes
  • Progress Charts - Track improvement over time with Chart.js
  • Typing Heatmap - Visual representation of key usage
  • Error Analysis - Identify common mistakes and problem keys
  • Character Accuracy - Detailed breakdown by character
  • AI Performance Analysis - Intelligent insights and recommendations

🔊 Keyboard Sounds

  • 6 Sound Types - Mechanical, Typewriter, ASMR, Soft, Clicky, Silent
  • Volume Control - Adjustable from 0-100%
  • Real-time Generation - Web Audio API (no external files)
  • Zero Latency - Instant feedback on every keystroke

🎨 Customization

  • 5 Color Themes - Light, Dark, Blue, Pink, Green
  • 4 Font Options - Default, Monospace, Serif, Sans-Serif
  • On-screen Keyboard - Visual feedback with key highlighting
  • Difficulty Levels - Easy, Medium, Hard word lists
  • Multiple Languages - English and Bangla support

🏆 Gamification

  • Achievement System - Unlock badges based on performance
  • Profile Tracking - Save progress with Firebase authentication
  • Test History - Review all past tests and results
  • Personal Records - Track your best performances

🔐 User Authentication

  • Firebase Auth - Secure login/signup system
  • Google Sign-in - Quick authentication with Google
  • Profile Management - Track stats across devices
  • Data Persistence - Cloud-based storage with Firestore

🚀 Getting Started

Prerequisites

  • Modern web browser (Chrome, Firefox, Safari, Edge)
  • Internet connection (for Firebase features)
  • No installation required!

Quick Start

  1. Clone or Download the repository
  2. Open index.html in your web browser
  3. Start typing - The test begins automatically!

For Development

# Clone the repository
git clone https://github.com/yourusername/typemaster.git

# Navigate to project directory
cd typemaster

# Open in browser
start index.html  # Windows
open index.html   # macOS
xdg-open index.html  # Linux

📁 Project Structure

TypeMaster/
├── index.html          # Main HTML file
├── styles.css          # All styling and themes
├── script.js           # Core application logic
├── README.md           # This file
├── FEATURES.md         # Detailed feature documentation
├── USER_GUIDE.md       # User instructions
├── DEVELOPER_GUIDE.md  # Developer documentation
├── API_REFERENCE.md    # Code API reference
├── CHANGELOG.md        # Version history
├── CONTRIBUTING.md     # Contribution guidelines
├── LICENSE.md          # License information
└── TROUBLESHOOTING.md  # Common issues and solutions

🎯 How to Use

Basic Usage

  1. Select Game Mode - Choose from 6 different modes
  2. Adjust Settings - Configure time, difficulty, language, sounds
  3. Click Start or just start typing
  4. View Results - Get detailed analysis after completion

Keyboard Shortcuts

  • Tab - Start/Restart test
  • Escape - Stop current test
  • Just start typing - Auto-starts the test

Tips for Best Results

  • Focus on accuracy first, speed will follow
  • Use proper finger placement on home row
  • Practice regularly for consistent improvement
  • Take breaks to avoid fatigue
  • Try different game modes to stay engaged

🛠️ Technology Stack

Frontend

  • HTML5 - Semantic markup
  • CSS3 - Modern styling with CSS variables
  • JavaScript (ES6+) - Vanilla JS, no frameworks

Backend & Services

  • Firebase Authentication - User management
  • Cloud Firestore - Data storage
  • Firebase Hosting - Deployment (optional)

Libraries

  • Chart.js - Data visualization
  • Font Awesome - Icons
  • Web Audio API - Keyboard sounds

🎨 Themes

TypeMaster includes 5 beautiful themes:

  • Light - Clean, bright interface (default)
  • Dark - Easy on the eyes for night typing
  • Blue - Professional blue color scheme
  • Pink - Vibrant pink aesthetic
  • Green - Calming green tones

🌐 Browser Support

Browser Version Support
Chrome 90+ ✅ Full
Firefox 88+ ✅ Full
Safari 14+ ✅ Full
Edge 90+ ✅ Full
Opera 76+ ✅ Full

📱 Responsive Design

TypeMaster is fully responsive and works on:

  • 💻 Desktop computers
  • 💻 Laptops
  • 📱 Tablets
  • 📱 Mobile phones

🔒 Privacy & Security

  • User data is stored securely in Firebase
  • Passwords are hashed and never stored in plain text
  • Google Sign-in uses OAuth 2.0
  • No personal data is sold to third parties
  • See PRIVACY.md for full privacy policy

🤝 Contributing

We welcome contributions! Please see CONTRIBUTING.md for guidelines.

Ways to Contribute

  • 🐛 Report bugs
  • 💡 Suggest new features
  • 📝 Improve documentation
  • 🔧 Submit pull requests
  • 🌍 Add translations

📄 License

This project is licensed under the MIT License - see LICENSE.md for details.

👨‍💻 Author

Taafeef Bin Montaquim

  • Portfolio: [Your Portfolio URL]
  • GitHub: [Your GitHub]
  • LinkedIn: [Your LinkedIn]

🙏 Acknowledgments

  • Chart.js for beautiful data visualization
  • Firebase for backend infrastructure
  • Font Awesome for icons
  • The typing community for inspiration

🔗 Related Projects

📞 Support

Need help? Found a bug?

🗺️ Roadmap

Coming Soon

  • Multiplayer racing mode
  • Global leaderboards
  • Custom text import
  • Mobile app (iOS/Android)
  • More languages
  • Advanced statistics
  • Team/organization features
  • Typing certificates

⭐ Star History

If you find TypeMaster useful, please consider giving it a star on GitHub!


Made with ❤️ by Taafeef Bin Montaquim

Happy Typing! ⌨️✨