I'm building a quiz app and using some API to fetch data, the response that I get back after making a GET request is something like this
[
{
"id": 910,
"question": "What used to be called a minion in Kubernetes cluster?",
"description": null,
"answers": {
"answer_a": "A component of the master node.",
"answer_b": "A monitoring engine used widely in Kubernetes.",
"answer_c": "Docker container service.",
"answer_d": "A worker node.",
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "false",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "true",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Medium"
},
{
"id": 1019,
"question": "Is Kubernetes open-source?",
"description": null,
"answers": {
"answer_a": "True",
"answer_b": "False",
"answer_c": null,
"answer_d": null,
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Easy"
},
{
"id": 1010,
"question": "While starting minikube, a configuration file, gets created by default inside what directory on Linux?",
"description": null,
"answers": {
"answer_a": "/tmp",
"answer_b": "/home/user/.kube",
"answer_c": "/root",
"answer_d": "/home/user",
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "false",
"answer_b_correct": "true",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Medium"
},
{
"id": 962,
"question": "Which of the following are true for a pod in Kubernetes?",
"description": null,
"answers": {
"answer_a": "A Pod represents processes running on your Cluster",
"answer_b": "Pods are the simplest units in the Kubernetes object model that you create or deploy",
"answer_c": "A pod is the same as a container",
"answer_d": "You can have only 1 container running in 1 pod",
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "true",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "true",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Medium"
},
{
"id": 1018,
"question": "Which Process Validates And Configures Data For The Api Objects Like Pods, Services?",
"description": null,
"answers": {
"answer_a": "kube-apiserver process validates and configures data for the api objects.",
"answer_b": "kube-apiserver process validates and configures data for the gui objects.",
"answer_c": "kube-apiserver process validates and configures data for the cli objects.",
"answer_d": null,
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Easy"
},
{
"id": 966,
"question": "What is the purpose of a ReplicaSet?",
"description": null,
"answers": {
"answer_a": "To prevent clones from invading other clusters",
"answer_b": "To monitor and respond to environmental latency",
"answer_c": "To maintain a stable set of replica Pods running at any given time",
"answer_d": "To create and maintain volumes",
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "false",
"answer_b_correct": "false",
"answer_c_correct": "true",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Easy"
},
{
"id": 1052,
"question": "What does 'become: yes' mean in Ansible playbooks?",
"description": null,
"answers": {
"answer_a": "It means that the command must be retried until it succeeds",
"answer_b": "It means that the service needs to be started once installed",
"answer_c": "It means that the worker node should become a manager node",
"answer_d": "It means that we would run all commands as root",
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "false",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "true",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": "answer_a",
"explanation": null,
"tip": null,
"tags": [
{
"name": "DevOps"
}
],
"category": "DevOps",
"difficulty": "Easy"
},
{
"id": 1017,
"question": "What Is The Use Of Kube-controller-manager?",
"description": null,
"answers": {
"answer_a": "kube-controller-manager embeds the core control loop which is a non-terminating loop that regulates the state of the system.",
"answer_b": "kube-controller-manager embeds the core control loop which is a terminating loop that regulates the state of the system.",
"answer_c": null,
"answer_d": null,
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Medium"
},
{
"id": 922,
"question": "What is the role of kube-apiserver and kube-scheduler?",
"description": null,
"answers": {
"answer_a": "The kube – apiserver follows the scale-out architecture and, is the front-end of the master node control panel.",
"answer_b": "The kube – apiserver follows the scale-out architecture and, is the back-end of the master node control panel.",
"answer_c": null,
"answer_d": null,
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Medium"
},
{
"id": 923,
"question": "What is ETCD?",
"description": null,
"answers": {
"answer_a": "Etcd is written in Go programming language and is a distributed key-value store used for coordinating between distributed work.",
"answer_b": "Etcd is written in Python programming language and is a distributed key-value store used for coordinating between distributed work.",
"answer_c": "Etcd is written in C++ programming language and is a distributed key-value store used for coordinating between distributed work.",
"answer_d": null,
"answer_e": null,
"answer_f": null
},
"multiple_correct_answers": "false",
"correct_answers": {
"answer_a_correct": "true",
"answer_b_correct": "false",
"answer_c_correct": "false",
"answer_d_correct": "false",
"answer_e_correct": "false",
"answer_f_correct": "false"
},
"correct_answer": null,
"explanation": null,
"tip": null,
"tags": [
{
"name": "Kubernetes"
}
],
"category": "DevOps",
"difficulty": "Easy"
}
]
when I try to log the response.data it works good but when I try to log the question of my first element with console.log(ques[0]) it doesn't works. Here is my code :
const [ques, setQues] = useState([]);
const loadedQues = [];
const fetch = async() => {
const response = await axios.get(`https://quizapi.io/api/v1/questions?
apiKey=${process.env.REACT_APP_QUIZ_API_KEY}
&limit=10
&category=DevOps`
)
let rawData = response.data;
rawData.map((item)=>{loadedQues.push(item)});
}
useEffect(()=>{
try{
fetch();
setQues(loadedQues);
console.log(ques[0]);
}
catch(error){
console.log(error);
}
}, []);