Developer_Quiz_Site
Developer_Quiz_Site copied to clipboard
[Refactoring] - move the project code to use react-router-dom
What bug did you find in the codebase?
currently, the views are changed by changing the state...
for example - after user pressing the get started button, the isHomePage state changed to false and the quiz-categories component is shown
This logic is totally doing the job, but, in my opinion -
this can be much clearer:
we can take the advantage of using
react-router-dom tool, and make view-changing logic more simple & clear
by mapping different views to specific urls (routes):
for example:
navigating to url
/ - will show welcome page
/quizzes - will show select quiz category page
/quizzes/HTML/questionsNumber - will show select questions number page, for selected HTML quiz
/quizzes/HTML/questions/1/to/10 - will show first question of HTML quiz (when it has 10 questions)
/quizzes/HTML/results
this will make the QuizTemplate component and other comopnents`s code shorter...
also it will make user able to navigate to different parts by changing url in the browser...
i know it will require a lot of changes in different parts in the project, so i guess - the right thing will be to start and change things gradually and check after every step....
it is like gradually replace an old combustion engine with new electric one, while keep the car able to move at each step...
here is a checklist
- [x] upgrade to latest version of react & react-router-dom
- [x] try to use router only to show
welcome&quizpages - [ ] show select-category by specific route
- [ ] show quiz
- [ ] move to next quiz
- [ ] show results
- [ ] start change components state to be taken from routeParams