Random Trivia API

In this assignment, you’ll be working with a Random Trivia API: https://the-trivia-api.com/v2/questions/

Begin by pasting it into your browser and taking a look at the array of JSON objects that appear. Each object includes a question and a correct answer, along with additional information, including an array of incorrect answers.

Refresh your browser and you should see a new set of ‘trivia’ objects.

Your Job is…

to draw upon everything that you learned how to do in the previous Lists with SwiftUI and Working With APIs exercises to create:

  1. a List that displays the questions, that also includes
  2. a NavigationView and NavigationLinks to the questions so that the correct answer appears in a new view when a question is clicked.

Don’t panic! The previous two lessons contain everything that you need to accomplish this assignment, plus there is a helpful trail of breadcrumbs below to help you get through this.

To begin,

copy the two structs shown below and paste them at the bottom of your contentView file. Make sure they are not inside of another struct! 

// MARK: - QuizItem
struct QuizItem: Codable, Identifiable {
    let category: String
    let id: String
    let correctAnswer: String
    let incorrectAnswers: [String]
    let question: Question
    let tags: [String]
    let type: String
    let difficulty: String
    let regions: [String]
    let isNiche: Bool
}

// MARK: - Question
struct Question: Codable {
    let text: String
}

You could also put these at the top as in Working with APIs, the location doesn’t matter 🙂

Hints/Tips

  1. Duplicate the Working With APIs project folder and use the copied project for this assignment.
  2. Replace the url that leads to the Pokemon data with https://the-trivia-api.com/v2/questions/
  3. Replace the Pokemon and PokemonRequest struct with the two shown above, named QuizItem and Question. You are welcome to copy and paste them.
    1. Then, replace @Published var pokemonList: [Pokemon] = [] with 
@Published var quizList: [QuizItem] = []
  1. Next, update the do statement by replacing it with 
do {
                // Decode the JSON into your model
                let decodedResponse = try JSONDecoder().decode([QuizItem].self, from: data)
                DispatchQueue.main.async {
                    self.quizList = decodedResponse
                }
            }
  1. In ContentView, you’ll need to update the List so instead of being List(viewModel.pokemonList) { pokemon in, it reads
List(viewModel.quizList) { QuizItem in
  1. Finally, replace the Text with 
Text(QuizItem.question.text.isEmpty ? "No Question Available" : QuizItem.question.text)

We’ve added a catch statement to make sure the row is filled even if data is missing

  1. You may need to change a few more variables, but take them one at a time and try to change all instances of pokemon with QuizItem, for example.

Your Job at this point is to

Refer to the Lists with SwiftUI lesson to figure out how to create a link to the correct answer (aka: correctAnswer ). You can do this!

What else can I do?

Look at the feed that you are using. Each object contains, in addition to a question and a correct answer, 3 incorrect answers. Give some thought to how you could turn this whole thing into a multiple-choice exercise with scoring.

Also, note that each object comes with a category. You can easily generate a custom feed for a specific category by appending, for example,
?categories=film_and_tv or ?categories=history to your URL, like this:
https://the-trivia-api.com/v2/questions/?categories=history. You can call more than one category by adding commas like this:
https://the-trivia-api.com/v2/questions/?categories=history,geography

Don’t forget to make this app your own!

Did you…

  • add a title?
  • add a fun background?
  • edit the text?
  • see if there’s anything else you want to add to make your app better? (ex. make your app refreshable)

Put everything together that you’ve covered so far and see if you can add some personality to your very own random trivia app. Don’t be afraid to do some Googling at this point as you play around with your style.