About

Are you waiting to challenge your friends to the become the greatest champion of useless facts? This is the Quiz App for you.

Why?

I chose vite and RTK for this build. The main focus of this project was to establish a functional knowledge of RTK, especially with regard to the accepted patterns and chacing usage. Along the way I was not focusing on CSS, but I decided to use Styled components to get more experience with the "module" design pattern of styling components.

How?

Using RTK I fetch the general information about Quiz options from Open Trivia DB which of course are cached. When a user decides on a Quiz, using RTK Query builder, I fetch the specific information from Open Trivia DB and generate a list of quiz questions which are saved in a store. This store is used to generate each question page, the user essentially navigates an array of questions.

Lessons

Using RTK had a large learning curve. I ran into an issue where I was making an API call every time the drop-down menu was changed due to not wrapping the query in a useMemo hook. Another interesting problem I ran into is the return value of some of the questions that had particular HTML-only characters in them. By that I mean   for example. Using html-react-parser was a lifesaver here! Do not use "dangerouslySetInnerHTML".