Authors kikkipedia and Daniel Dumville 🤝
This project was structured around the specifications outlined by Noroff which are summarised below:
- Build an online trivia game as a Single Page Application using the Vue.js framework (version 2.x).
- Design a wireframe using Figma
- Write HTML % CSS as needed
- App starts here
- User must be able to select the difficulty, number of questions and category.
- User must click a button or anywhere on the screen to start playing.
- Once the game starts, the app must fetch the questions from the API setup in the previous step. The app must ONLY display ONE question at a time.
- If it is multiple choice, have 4 buttons with each answer as the text. If it is a True/False question, only display 2 buttons, one for True and one for False.
- Once a question is answered the app must move on to the next question.
- When all the questions have been answered the user must be presented with the result screen.
- The result screen must show all the questions along with the correct and user’s answers.
- Display the total score.
- Display a button to take the user back to the start screen or replay with different questions, but at the current difficulty level and category.
The data to be used in the Trivia quiz was to be fetched from an API. Open Trivia Database was used and is accessible through the following link: https://opentdb.com/api_config.php
This project was completed with JavaScript, HTML, CSS and Vue.
This finished product was containerized and is accessible via Heroku at this link: https://frozen-sea-00856.herokuapp.com/
npm install