- AKA React Trivia App
- AKA #react-trivia
DKF Completed @ 2024-03-07
- /src/App.css
- Custom CSS built on top of the Bootstrap framework
- /src/App.tsx
- Topmost parent component
- /src/trivia.tsx
- Trivia data (questions, answers, etc.)
- /src/assets/brAInbow.ico
- Page ico of a "brain rainbow" created by AI
- /src/components/ButtonGroup.tsx
- Child component of Card; used for the "Back," "Next," and "End Game" buttons
- /src/components/Card.tsx
- Direct child component of App; used as the central container in the body to display each question and its associated information
- /src/components/Dropdown.tsx
- Child component of Card; used to hold the answer options
- /src/components/Header.tsx
- Direct child component of App; used for the header element
- /src/components/Score.tsx
- Direct child component of App; used for the footer element
Now that you have some basic React under your belt, you’re ready to put your new knowledge into use! You’re going to create your first solo project from scratch. We hope you enjoy trivia because your next assignment is to create a trivia app in React!
React Trivia Requirements:
- At least 20 questions and answers
- 1 or more Buttons for interactivity
- Show one question or answer at a time
- Move forward or back through the trivia questions
- When moving forward or back through cards the new card should show the question and not the answer
- Bonus: Keep score