The Production of InQuiz

Today, programming is the collection of software engineers striving to build bigger and better programs, programs aimed at developing a better quality of life; luxuries everyone wants to be able to afford.

InQuiz requires an API to draw on with every renewal of the page. It also needs memory and the capacity to enhance a generic quiz, and thus the names and scores are etched into the scoreboard and remembered. Building a react single page application from scratch required me to better organize my work. The JS files were all structured effectively by breaking the one big file into smaller segments and developing each component as required. I had to apply my knowledge of components, props and state management to incorporate client side routing and establish the application as a whole.

When you first open up Inquiz, you are met with a “Log In” panel. Enter your name (which get saved in State for later) and you are ready to go. Pick your favorite quiz category and you suddenly find yourself in the most trying questionnaire of your existence.

Using the external data from “Open Trivia Database”, Inquiz displays questions, paired with multiple choice answers which are randomly shuffled each time using a ‘Fisher-Yates shuffle’ . It then gives you your score, the questions you got correct and incorrect (along with the corresponding answers).

Once a quiz has been completed, all the states are wiped clean, ready to go again and your quiz score is pushed to a JSON database. If you wish to view your scores, head over to the “Scores” tab, which will pull the data back from the database and cleanly display the information in a bar graph.

Using React made it far easier to develop an application than vanilla. The idea of setting JS out into components, both presentation and container, makes it so much easier (and faster) to set out an application and to develop it.