DevMode

---

About

DevMode asks you 10 questions about your coding habits: how many tabs you keep open, how you react to a production outage at midnight, what your commit messages look like. It then matches you with one of six developer personalities:

	Personality	Motto
🤖	The AI-Powered Coder	Why write code when you can write prompts?
🐛	The Debugging Legend	No bug survives first contact with you.
📚	The Stack Overflow Warrior	Copy. Paste. Pray. Ship.
☕	The Sleep-Deprived Engineer	Sleep is just a deprecated feature.
🏗️	The Overengineering Specialist	Why use one file when you can use forty?
🚀	The Future Tech Founder	It's like Uber, but for… everything.

Each result includes a funny description, strengths, weaknesses, a fictional developer stat sheet, and a breakdown of how your answers matched all six types.

Features

• 10 multiple-choice questions, shown one at a time with smooth slide transitions
• Progress bar that fills as you answer
• Back / Next navigation: go back and change an answer at any time
• Keyboard shortcuts: press 1–4 to pick an answer, Enter to continue, ← to go back
• Point-based scoring with a fair tie-breaker
• Detailed result card: description, strengths, weaknesses, animated stat sheet and personality breakdown
• Copy results to the clipboard, with a fallback for older browsers
• Share button: uses your phone's native share sheet, or opens a pre-filled post on X (Twitter) on desktop
• Retake quiz button that fully resets the quiz
• Responsive design for desktop, tablet and mobile
• Accessible: keyboard-friendly, visible focus states, and reduced motion for users who ask for it
• Dark, terminal-inspired design with neon-green and purple accents

Screenshots

Start screen	Question

Result (desktop)	Mobile

Run it locally

You don't need to install anything.

Option 1: just open it

1. Download or clone this repository.
2. Double-click index.html. It opens in your browser and everything works.

Option 2: use a tiny local server (optional)

A local server makes the page behave exactly as it will once it's online. Pick whichever you have:

# Python 3
python -m http.server 8000 --bind 127.0.0.1

# Node.js
npx serve .

Then visit http://localhost:8000 (or the address serve prints).

If you run Python without --bind and it prints http://[::]:8000/, don't open that link. [::] only means "listening on every network address". Go to http://localhost:8000 instead.

VS Code users: the free Live Server extension works too. Right-click index.html and choose Open with Live Server.

Deploy to GitHub Pages

The site is static, so GitHub Pages can host it for free:

1. In the repository, open Settings → Pages.
2. Under Build and deployment, set Source to Deploy from a branch, then pick main and / (root) and save.
3. After a minute or two the quiz is live at https://<your-username>.github.io/DevMode/.

Shared links show a preview card (title, description and screenshots/social-preview.png) on WhatsApp, LinkedIn, X, Slack and Discord. If you fork the project, update the og:url and og:image addresses in index.html to your own Pages URL.

Project structure

DevMode/
├── index.html      # Page structure: start, quiz and result screens
├── style.css       # All styling: colors, layout, animations, mobile tweaks
├── script.js       # Questions, personalities, scoring and interactivity
├── favicon.svg     # Logo / browser tab icon
├── screenshots/    # README images and the link-preview card
├── LICENSE         # MIT License
└── README.md

How the scoring works

Every answer belongs to one personality and gives it 2 points. A few answers also give a 1-point bonus to a second personality (for example, "I traced every line at 3 AM" counts for the Debugging Legend and gives a bonus to the Sleep-Deprived Engineer).

After question 10, the personality with the most points wins. If two personalities tie, the one you picked most recently wins. The breakdown chart shows each personality's share of your total points, rounded with the largest-remainder method so the six percentages always add up to exactly 100.

The questions are balanced so that no personality dominates. Across all 1,048,576 possible ways to answer the 10 questions, each personality wins between 14.6% and 19.2% of the time:

Personality	Share of all answer combinations
The AI-Powered Coder	19.2%
The Overengineering Specialist	18.3%
The Future Tech Founder	17.2%
The Sleep-Deprived Engineer	15.7%
The Debugging Legend	15.0%
The Stack Overflow Warrior	14.6%

Want to add your own questions or personalities? Everything lives at the top of script.js in two plain lists, PERSONALITIES and QUESTIONS. Add an entry and the rest of the app picks it up automatically.

Built with

• HTML5
• CSS3 (custom properties, grid, flexbox, keyframe animations)
• Vanilla JavaScript (ES6+)
• Space Grotesk and JetBrains Mono from Google Fonts

License

Released under the MIT License. Feel free to fork it, remix it and make it your own.