How evengene/harry-potter-quiz works
This is a React/Redux Harry Potter quiz: a user starts a 10-question quiz, answers questions with progress and feedback, sees a score-dependent result, and can restart. The active route setup and sampled components support this flow. Quiz difficulty selection appears in the README’s future-work list and is not active in the sampled router. The graph omits uncertain wiring; notably, the start handler calls the quiz-start action creator but does not dispatch it.
Main entry points: Question.jsx Question screen · Result.jsx Result screen · Quiz.jsx Quiz intro · index.js Redux store
Components 13
Quiz screens
- Quiz intro
src/components/Quiz/Quiz.jsx - Question screen
src/components/Question/Question.jsx - Result screen
src/components/Result/Result.jsx - Shared wrapper
src/components/Wrapper/Wrapper.jsx - Question content
src/components/Quiz/Quiz.constants.js - Score messaging
src/components/Result/Result.utils.js
Quiz state
- Quiz actions
src/actions.js - Quiz reducer
src/reducer.js - Redux store
src/index.js
Application runtime
- App bootstrap
src/index.js - Route setup
src/index.js
Other components
- Quiz user
- Vercel Analytics
Connections 24
- Quiz user → Quiz intro: starts quiz
- App bootstrap → Route setup: configures routes
- Route setup → Quiz intro: renders home
- Route setup → Question screen: renders questions
- Route setup → Result screen: renders results
- Quiz intro → Question screen: navigates to
- Quiz user → Question screen: selects answer
- Question screen → Quiz actions: calls answer
- Question screen → Quiz actions: calls go back
- Result screen → Quiz actions: calls restart
- Quiz actions → Redux store: dispatches actions
- Redux store → Quiz reducer: reduces actions
- Quiz reducer → Redux store: returns state
- Question screen → Redux store: reads quiz state
- Result screen → Redux store: reads answers
- Question screen → Question content: reads questions
- Quiz reducer → Question content: reads question count
- Result screen → Question content: reads question count
- Result screen → Score messaging: calculates score
- Result screen → Quiz intro: navigates on restart
- Quiz intro → Shared wrapper: renders within
- Question screen → Shared wrapper: renders within
- Result screen → Shared wrapper: renders within
- App bootstrap → Vercel Analytics: renders analytics