Need help : coding un Quiz

Bonjour,
Je suis en train de coder un quiz sur la Grèce antique avec plusieurs questions. Chaque question a pour le moment deux choix. Mais j’aimerais passer d’une question à une autre grâce à bouton “suivant”.
J’ai décidé d’utiliser les classes pour créer mes objets-questions. Est-ce la bonne méthode ?
Voici mon repo github avec l’ensemble des fichiers.
https://github.com/tranedz/quiz_mythologie_grecque
Merci d’avance pour vos réponses. :slightly_smiling_face:

Hello @Olsen

you doing great well done but i did not read the full code so i have some notice

  1. it much better to use the variable after define it so for example you define question2 after using it in the event handler question2.announceQuestion();

  2. i see you use arrow function a lot i see other do also but i still do not understand why people use it and in the same time they name it

for example here

      /* get the info in the question each time */

this exact the same as function announceQuestion(){}

so for me i use arrow function when i do not need to use it again like when i filter array so in other word it would be a one time call

  1. i notice alot of nested funtion like displayChoiceOne(); i think it would be a funtion displayChoice() and you call it with the parameters and you can even make it more general like has parameter to determine the number of choice so it would work if you change it to make 3 / 4 choices instead of 2

  2. you can create the questions and put them in array and select question randomly from that array

  3. you could make all answer for certain question as array which you display so choiceone and choicetwo be just 2 element in an array and you could loop on that array to show up the answer while have another filed to determine which one is the correct

by the way i am just a learner same as you so i could be wrong and have a nice day :slight_smile:

also you can make all the question and answer in an json file and use your js to parse it so when ever you want to add any question you just edit that file

Hello ! Thanks a lot for your comments. I will try to apply your advice. I had to create a new project to try with your recommendations. I was wondering how to link the question and its choices?
The questions appear randomly. Thanks for this idea! Should I create an object that groups the whole question and its answers?
Here is my code:

  • Questions

      const myQuestions = {
    
          "bloc": {
              "question": [
                  "Quel nom donne t-on à la grande place publique présente dans chaque cité grecque ?",
                  "Contre quel ennemi combattirent les Grecs lors des Guerres médiques?"
              ]
          }
      }
    
  • Responses

      const myResponses = {
              "questionOne": {
                  "choix": [
                      "L'agora",
                      "L'acropole",
                      "Le temenos",
                      "La pnyx"
                  ]
              },
              "questionTwo": {
                  "choix": [
                      "Les Romains",
                      "Les Gaulois",
                      "Les Perses",
                      "Les Phéniciens"
                  ]
              }
          }
    

Is this the right way to do it? I still lack practice and I don’t use enough functions in my code how I should do it.
Thanks a lot for your help. Good learning to you!

@Olsen you very welcome

let us thinnk of it from class point of view

we have class question{
questionitself \ this would be the string of the question
answers \ this will be all the answers for this question so it an array of answer object
}

now for answer

class Answer{
answerText \ this will hold the answer text so it can be string
answerImage \ this will hold the image this can be string holding path to the image which should be displayed
validAnswer \ this could be boolean value to specify if that answer is valid or not
}

the above is just sample not valid code so you can add the missing parts

your solution is good but it take answer as string values but from what i read from your old code you have image or i miss something

also make the answer as object allow you to give it more that just text like give it a boolean flag to make it valid answer or not

also using json to put all the questions and answer and parse that json file from your js would make it easy to add new questions and answer without need to edit your js

there a learning material here to learn about json

hope that help and have a nice day :slight_smile:

1 Like