A minimalist, blazingly fast typing practice application built with Astro and React.
NinjaType helps you master touch typing with real-time feedback, performance analytics, and a distraction-free interface. Track your words per minute (WPM), analyze your progress with interactive charts, and customize your experience with multiple themes and word sets.
- 🎯 Real-time Typing Test - Instant feedback on your typing speed and accuracy
- 📚 Learn Touch Typing - Master each finger individually with progressive lessons and achievement badges
- 📊 Performance Analytics - Track WPM, accuracy, and progress with interactive charts
- 📈 Typing Speed History - View your complete typing history with lifetime and daily best stats, filter by time ranges (1 day, 7 days, 2 weeks, 1 month, all time), and track aggregate statistics
- 🎨 13+ Beautiful Themes - Including Dracula, Tokyo Night, Catppuccin, Nord, and more
- 📝 Multiple Word Sets - Practice with 1k, 2k, 5k word lists and custom quotes
- ⚙️ Customizable Settings - Configure word count, typing modes, and countdown timers
- 📱 Responsive Design - Works seamlessly on desktop, tablet, and mobile
- 🚀 Lightning Fast - Built with Astro for optimal performance
- 🎭 Quote Collections - Practice with motivational, funny, programming, and brainrot quotes
- 🔄 State Persistence - Your settings and preferences are saved automatically
- ⌨️ Keyboard-focused - Designed for keyboard warriors
- ❓ SEO-Optimized FAQs - Comprehensive FAQ sections on main and learn pages for better discoverability
- 📄 Enhanced About Page - Detailed feature documentation with direct access links
- Bun (recommended) or Node.js 18+
- A modern web browser
- Clone the repository:
git clone https://github.com/VivekGupta137/ninjatype.git
cd ninjatype- Install dependencies:
bun install- Start the development server:
bun dev- Open your browser and navigate to
http://localhost:4321
| Command | Action |
|---|---|
bun install |
Install dependencies |
bun dev |
Start dev server at localhost:4321 + auto version |
bun build |
Build production site to ./dist/ |
bun preview |
Preview your build locally before deploying |
bun version:patch |
Bump patch version (1.0.x) |
bun version:minor |
Bump minor version (1.x.0) |
bun version:major |
Bump major version (x.0.0) |
bun deploy |
Deploy to Cloudflare Workers |
ninjatype/
├── public/ # Static assets
│ ├── fonts/ # Custom fonts
│ ├── images/ # Images and icons
│ ├── themes/ # CSS theme files
│ └── favicon/ # Favicon and manifest
├── src/
│ ├── components/ # React & Astro components
│ │ ├── analytics/ # Performance tracking components
│ │ ├── charts/ # Data visualization components
│ │ ├── keyboard/ # Typing interface components
│ │ ├── seo/ # SEO and schema components
│ │ ├── settings/ # Configuration components
│ │ └── toolbar/ # UI toolbar components
│ ├── constants/ # App constants and configurations
│ ├── content/ # Markdown content pages
│ ├── data/ # Word lists and quote collections
│ ├── hooks/ # Custom React hooks
│ ├── icons/ # Custom icon components
│ ├── layouts/ # Astro layout templates
│ ├── pages/ # Route pages
│ │ ├── index.astro # Main typing practice page
│ │ ├── history.astro # Typing history and analytics
│ │ └── api/ # API endpoints
│ ├── store/ # Nanostores state management
│ ├── styles/ # Global styles
│ └── util/ # Utility functions
├── astro.config.mjs # Astro configuration
├── package.json # Dependencies and scripts
├── tsconfig.json # TypeScript configuration
└── wrangler.jsonc # Cloudflare Workers config
NinjaType comes with 13 carefully crafted themes:
- Default
- AMOLED (True Black)
- Catppuccin
- Dracula
- GitHub Dark
- Gruvbox
- Material
- Monokai
- Nord
- One Dark
- Rose Pine
- Solarized Dark
- Tokyo Night
All themes are located in public/themes/ and can be easily customized.
- Framework: Astro - Static site generation with islands architecture
- UI Library: React - Component-based UI
- State Management: Nanostores - Minimal state management
- Charts: Nivo & Visx - Data visualization
- Icons: Iconify & Lucide React
- Styling: CSS with theme system
- Deployment: Cloudflare Workers
- Runtime: Bun - Fast JavaScript runtime
- Start Typing: Click on the typing area or press any key to begin
- Choose Your Mode: Select word count (10, 25, 50, 100) or time mode (15s, 30s, 60s, 120s)
- Learn Touch Typing: Visit
/learnto practice with each finger individually and earn achievement badges - Pick a Theme: Switch themes from the settings to match your style
- Select Word Sets: Choose from different word lists or quote collections
- Track Progress: View your WPM, accuracy, and performance charts in real-time
- View History: Navigate to
/historyto see your complete typing history with lifetime stats, daily bests, and filterable performance data - Reset Anytime: Press ESC or click the reset button to start over
NinjaType includes a dedicated learning mode to help you master touch typing:
- Finger-by-Finger Practice: Focus on one finger at a time (index, middle, ring, pinky)
- Progressive Lessons: Build muscle memory with finger-specific key combinations
- Real-time Feedback: See your WPM and accuracy as you type
- Achievement Badges: Earn badges at 20, 30, 40, and 50+ WPM milestones
- TypeNinja Badge: Complete all finger lessons to unlock the ultimate achievement
- Progress Tracking: Your best scores are automatically saved for each finger
Visit /learn to start your touch typing journey!
Contributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the GNU General Public License v3.0 - see the LICENSE file for details.
- Built with Astro
- Inspired by various typing practice applications
- Community contributors and testers
- Issues: GitHub Issues
- Discussions: GitHub Discussions
If you find NinjaType helpful, please consider supporting its development:
- ⭐ Star this repository on GitHub
- 💝 Sponsor on GitHub - One-time or monthly sponsorship
- 🎨 Support on Patreon - Get exclusive perks and early access
- 🐛 Report bugs and suggest features
- 🤝 Contribute code or documentation
Your support helps keep this project alive and continuously improving!
Made with ❤️ by Vivek Gupta
Happy Typing! ⚡
