Scrimba - Quizzical Trivia solution

This is a solution to the Quizzical Trivia solo project on Scrimba. Scrimba helps you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • Requirements
  • Screenshot
  • Links
  • Getting Started with Create React App
• My process
  • Built with
  • Continued development
  • Useful resources
• Author
• Credits

Overview

Requirements

• Two screen (start & questions)
• Pull 4 questions from the OTDB API
• Tally correct answers after "Check answer" is clicked
• Styled & polished

Screenshot

Links

• Live Site URL: @Netlify
• Solution URL: @GitHub

Getting Started with Create React App

This project was bootstrapped with Create React App.

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid Layout
• React.JS

Continued development

I'd like to:

• Deny check answers without being all selected
• Add loading animation while APIs fetching

Useful resources

• ReactJS - How to set up a local development environment on your computer
• ReactJS - How do I bind a function to a component instance?
• Confetti @Github
• StackOverflow - How to force div's contents to stay in one line
• logrocket - Using dangerouslySetInnerHTML in a React application
• apestruy - Shuffling an array in Javascript
• sebhastian - Better way to shuffle arrays (Fisher-Yates algorithm) -StackOverflow - How to fix warning "function -- makes the dependencies of useEffect Hook change on every render
• StackOverflow - How to disable button in React.js

Author

• Website - Emanuele Del Monte

Credits

• OpenTDB - APIs