A modern, beautiful, and interactive web application designed to help users master Japanese typing. Built with Next.js 14, this application offers a premium user experience with real-time feedback, progress tracking, and custom practice modes.

• 🎮 Interactive Typing Game: Real-time typing engine with immediate feedback on accuracy and speed (WPM).
• 📊 Progress Tracking: Detailed dashboard showing your typing history, accuracy trends, and level progression.
• 📝 Custom Library: Create and manage your own practice content. Upload texts or add them manually.
• 🎨 Premium Design: A sleek, modern interface with dark mode support, smooth animations, and glassmorphism effects.
• 🔐 User Authentication: Secure signup and login system to save your progress.
• 🇯🇵 Kana Support: Intelligent Romaji-to-Kana conversion for authentic Japanese typing practice.

• Framework: Next.js 14 (App Router)
• Language: TypeScript
• Styling: Tailwind CSS
• Database: SQLite (via Prisma)
• Authentication: NextAuth.js
• State Management: React Hooks & Server Actions

• Node.js 18+ installed
• npm or yarn

1. Clone the repository

   git clone https://github.com/yourusername/japan-keyboard-typing.git
   cd japan-keyboard-typing

2. Install dependencies

   npm install

3. Set up the database

   npx prisma generate
   npx prisma db push

4. Run the development server

   npm run dev

5. Open http://localhost:3000 in your browser.

├── app/                  # Next.js App Router pages and API routes
├── components/           # Reusable UI components
│   ├── game/             # Typing game specific components
│   ├── dashboard/        # Dashboard widgets and charts
│   └── ui/               # Core design system components
├── lib/                  # Utility functions and typing logic
├── prisma/               # Database schema and migrations
└── public/               # Static assets

Contributions are welcome! Please feel free to submit a Pull Request.

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