DevType Typing Test

Problem

Most typing test apps use generic prose, but developers often type a different kind of text: commands, API language, debugging notes, architecture terms, and code-adjacent phrases. DevType needed to feel useful for that rhythm while still being simple enough to start immediately.

Solution

I built a developer-focused typing test with selectable durations, a large focusable typing area, generated technical prompts, live session metrics, and local stats. The app gives users a fast practice loop: start typing, track accuracy and errors, finish the session, then restart or generate a new prompt.

What I Owned

• Built the typing interaction and focusable prompt area.
• Added duration controls for short and longer practice sessions.
• Tracked live metrics such as time, accuracy, errors, and typed characters.
• Created result and local stats panels for best WPM, average WPM, and tests taken.
• Designed the visual system around a bold, tactile developer-tool interface.

Tech

• Next.js for the deployed app shell and page structure.
• React for the typing state, timer behavior, prompt rendering, and result updates.
• Tailwind CSS for responsive layout, strong borders, button states, and the warm terminal-inspired theme.

Key Decisions

• Used technical prompt content so the practice experience feels closer to the words developers type every day.
• Kept the main typing area large and keyboard-first so the core action stays obvious.
• Made metrics visible during the session without letting them overpower the prompt.
• Stored simple local performance stats so repeated tests feel progressive without requiring an account.

Tradeoffs

• The app focuses on a lightweight solo practice loop instead of multiplayer, accounts, or cloud leaderboards.
• Local stats are intentionally simple, which keeps the app fast but limits cross-device history.

Outcome

• Delivered a deployed typing tool tailored to developer practice.
• Demonstrated interactive React state management around timers, keyboard input, prompt generation, and score feedback.
• Added a polished product-style utility project to the portfolio alongside larger full-stack and capstone work.