Scrimba

Live Link

• Originally tried to use radio buttons for answer choices

• Mapping an answers array to render a radio button - didn't really mix and I didn't find any examples where this was done so I abandoned that idea

• Shuffled answer choices with code found on Stack Overflow

• Answers and questions have html-code in them - looked at some other attempts on Github and found a decode function

• In question, used code equivalent to a nested ternary to conditionally render the styles

• Didn't conditionally render correct answer

• Obviously, the idea was to add more conditional rendering practice but since questions repeat on some categories frequently, it may be a positive to not show the correct answer.

• Didn't style the app as the logic was not as solid as I would have liked

• handleChoice has way too much logic in it but the overly complicated data structure I started with and worrying about mutating state necessitated it

• Also performance wise - handleChoice is terrible

• Updating nested state is still a major disadvantage of React ie callback-esque hell

• Really hard to tell if you mutated state or not from just looking at the code

• After screenshots were taken, added a break after question to break it up

• I duplicated components when making breaking changes - they are the all copy files

• Two Screens (start & questions)
• Pull 5 questions from the OTDB API
• Tally correct answers after "check answers" is clicked
• Styled & Polished

• Stack Overflow - Randomize array
• Pluralsight - radio buttons & react
• Stack Overflow - radio buttons & react
• Stack Overflow - radio buttons
• Stack Overflow - pass multiple values of selected radio button in react
• Blog - avoid state for computed properties
• Geeks for Geeks - multiple inputs in react
• YouTube - ReactJS - Tutorial : How To Work With Multiple Radio Buttons with Function Based Components
• PreTagTeam - radio buttons
• Stack Overflow - redner array of inputs
• Stack Overflow - get key in js object by value
• YouTube - Dynamic Form Fields in React
• FreeCodeCamp - update state onclick
• TypeOfNan - useeffect
• Forum - encoding
• YouTube - React Quiz App tutorial
• Stack Overflow - updating state on click
• Stack Overflow - updating state when state is an array of objects
• Stack Overflow - setState
• Stack Overflow - updating state with hooks
• Stack Overflow - nested state & updating
• Blog - multiple classNames workarounds
• Stack Overflow - toggle onclick
• Stack Overflow - multiple functions onclick in react ?
• Dev.to - nested ternary
• Github - decode function taken from here