React Native
Quiz model
Design the Question model and state.
Quiz model
For a quiz app you first design the data model. Each question is a Question object: id (a unique number), question (the question text), options (an array of choices), answer (the index of the correct option). These fields fully describe a question.
Example: { id: 1, question: "Capital of Turkey?", options: ["Istanbul", "Ankara", "Izmir"], answer: 1 }. Here the correct answer is "Ankara" so answer is 1 (indexes start at 0). A quiz is an array of these objects: questions = [...]. This shape makes rendering questions, checking the answer and computing the score easy. The design stays simple but it carries the core of a real quiz app.
Exercise Define the questions array
Define a questions constant with 2 questions. Each question has id, question, options (3 choices) and answer. First question: { id: 1, question: "Capital of Turkey?", options: ["Istanbul", "Ankara", "Izmir"], answer: 1 }. Second question: { id: 2, question: "What is 2 + 2?", options: ["3", "4", "5"], answer: 1 }.
Show example solution
const questions = [
{ id: 1, question: "Capital of Turkey?", options: ["İstanbul", "Ankara", "İzmir"], answer: 1 },
{ id: 2, question: "What is 2 + 2?", options: ["3", "4", "5"], answer: 1 }
];
Why the model matters
Designing the question model makes the rest of the app easier. When questions are in an array, you move to the next question by incrementing the index, check the answer with question.answer and compute the score by counting correct answers.
This model also loads easily from a real API. If the server returns a JSON array, response.json() gives you the same shape. In the next lessons you will use this model to load questions from an API, write a quiz flow and compute the score. The foundation you lay here is the backbone of the whole project. A clean data model means a clean app.
Test yourself
-
What does the answer field of a Question hold?
{ id: 1, question: "...", options: ["...", "..."], answer: 1 }
- Soru metnini
- The index of the correct option
- The number of questions
- The question ID
Show answer
The index of the correct option — answer is the index of the correct option in options.
-
Define a Question object
const question = { id: 1, question: "Başkent?", options: ["İstanbul", "Ankara"], ____: 1 };
Show answer
const question = { id: 1, question: "Başkent?", options: ["İstanbul", "Ankara"], answer: 1 };
-
Match the field to its role
- id
- Unique number
- question
- Question text
- options
- Array of choices
- answer
- Correct index
Next lesson: Loading questions