Quizz QCM sur le javascript

Version imprimable

17/12/2020, 20h19
BeanzMaster

Quizz QCM sur le javascript

Salut à tous,

En pleine formation dans le développement web, je viens de terminer un petit projet de "Quizz" style QCM
Le thème du seul quizz disponible pour le moment c'est JAVASCRIPT !

Niveau design, c'est très simple, très kitch, très années 90, bref
Que dire, c'est 0% framewordk css, c'est 100% responsive, 100% Sass

Coté Javascript, je ne suis pas partie sur la solution la plus rapide et la plus facile à mettre en place.
Le code est 100% en POO avec des classes. C'est orienté MVC

Le Model : les données au format JSON + une classe de gestion QuizzardManager
La Vue : le code HTML et CSS
Le Contrôleur : la classe QuizzardApplication

L'avantage c'est que c'est très maintenable, et extensible. On pourra facilement rajouter des questions à choix multiple ou des questions ou il faut rentrer sa réponse dans un input de type texte, ou un système de drag&drop pour placer des étiquettes au bon endroit etc.... Bref beaucoup de possibilité à rajouter
J'ai commenté un maximum le code et j'ai laissé quelques commentaires "pollueur" en guise de notes. (en passant je vous conseil une petite extension pour vscode que je trouve bien sympathique << Better comments >>

J'ai aussi incorporé la bibliothèque "highlightjs" moyennant une petite modification dans son code.

Vous trouverez le code complet ici : https://github.com/jdelauney/jdelaun...folio/quizzard

Je ne sais pas si ma façon de faire est couramment utilisée et si elle est conseillée. Elle pourra peut-être déconcerter certain. Elle est simple, et pas trop compliqué à mettre en place.
Dans mon cas, je préfère cette approche, car j'ai l'habitude de coder en POO an pascal avec lazarus (vous pouvez me retrouvez dans le forum dédié à celui-ci sur DVP) et c'est plus naturel pour moi que du code procédural (c'est pour ça d'ailleurs que je ne suis pas un fan de Wordpress en passant)

Je suis bien amusé, j'en est bavé par moment, mais ça m'a permis de progresser et d'apprendre de nouvelle choses et de réviser pas mal de petit truc sur le Javascript

La base de données JSON peut-être chargée en local ou via serveur moyennant une modification mineur dans le constructeur de l'application
Le quizz contient 10 sections de 5 questions soit un total de 50 questions pour le moment. J'en rajouterai au fur et à mesure, car il y'a plein de questions qui manque (DOM, POO etc...)

Guru du Javascript que pensez vous de mon approche et de mon code ? (et si vous pouviez vérifier que les réponses soient juste, ça serait cool :yum: )

Maintenant c'est à vous de jouer et de tester vos connaissances en Javascript (de base) et surtout donnez nous votre score !

Pour commencez à jouer c'est par là : https://jdelauney.github.io/portfoli...ard/index.html

Merci d'avance de vos retours.

Cordialement

Jérôme
18/12/2020, 03h12
Doksuri

j'adore le theme <3

Le JavaScript est principalement utilisé en tant que langage ?
=> avant ou apres l'apparition des nodeJS & co ?

Le JavaScript peut s'utiliser conjointement avec ?
=> faute de frappe : de nombreux langages);

JavaScript est-il un langage multi-paradigme ?
=> avant ou apres l'arrivee des WebWorkers ? (ou alors je me trompe entre les termes)

Où dois-je placer de préférence mon code JavaScript dans une page web ?
=> ca n'a pas vraiment d'importance avec les defer/async... bien que ce soit une "best practice" (pour ne pas donner la reponse), ca ne changera rien au fonctionnement

Que fait la balise "&ltnoscript&gt" ? :aie: encodage, quand tu nous tiens...

Comment ajouter du code Javascript dans une page HTML ?
=> on n'est meme plus oblige de specifer de type

Que retourne "typeof(1&gt2)" ? encodage ;)

Quelle est la bonne syntaxe pour afficher un message ?
=> il y a 2 syntaxes possible ;)

Quel opérateur est utilisé pour concaténer des chaînes de caractères ?
`du test ${variable} et encore...`.

Lorsqu'on crée un variable qui ne devra pas être modifiée par la suite, quel mot-clé devons-nous utiliser ?
=> c'est pas tout a fait vrai... const assure l'origine de la variable developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/const

Citation:

Cela ne signifie pas que la valeur contenue est immuable, uniquement que l'identifiant ne peut pas être réaffecté

const test = []; test.push('ok');.

Quel resultat sera affiché dans la console ?
=> au bout de 10, je repond en random....
18/12/2020, 11h07
BeanzMaster

Citation:

Envoyé par Doksuri

j'adore le theme <3

Bonjour merci :ccool:

Citation:

Envoyé par Doksuri

Le JavaScript est principalement utilisé en tant que langage ?
=> avant ou apres l'apparition des nodeJS & co ?

Bonne remarque, effectivement.

Citation:

Envoyé par Doksuri

Le JavaScript peut s'utiliser conjointement avec ?
=> faute de frappe : de nombreux langages);

Ok, je vais corriger

Citation:

Envoyé par Doksuri

JavaScript est-il un langage multi-paradigme ?
=> avant ou apres l'arrivee des WebWorkers ? (ou alors je me trompe entre les termes)

Bonne question !, il est claire qu'au début du js, c'était non.

Citation:

Envoyé par Doksuri

Où dois-je placer de préférence mon code JavaScript dans une page web ?
=> ca n'a pas vraiment d'importance avec les defer/async... bien que ce soit une "best practice" (pour ne pas donner la reponse), ca ne changera rien au fonctionnement

Je vais le rajouté dans la correction

Citation:

Envoyé par Doksuri

Que retourne "typeof(1&gt2)" ? encodage ;)
Que fait la balise "&ltnoscript&gt" ? :aie: encodage, quand tu nous tiens...

:aie: je n'ai pas fait gaffe, en changeant mes innerHTML par textContent

Citation:

Envoyé par Doksuri

Comment ajouter du code Javascript dans une page HTML ?
=> on n'est meme plus oblige de specifer de type

Je ne savais pas. Je vais le préciser dans la correction

Citation:

Envoyé par Doksuri

Quelle est la bonne syntaxe pour afficher un message ?
=> il y a 2 syntaxes possible ;)

:aie:merde j'ai fais un copier-coller en trop ???, je vais vérifier

Citation:

Envoyé par Doksuri

Quel opérateur est utilisé pour concaténer des chaînes de caractères ?
`du test ${variable} et encore...`.

Effectivement, je ne parle pas du template string. Ca serait une question à rajouter :D

[QUOTE=Doksuri;11661289]
Lorsqu'on crée un variable qui ne devra pas être modifiée par la suite, quel mot-clé devons-nous utiliser ?
=> c'est pas tout a fait vrai... const assure l'origine de la variable developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/const
const test = []; test.push('ok');.
Mouais, c'est vrai ici dans la cas d'un tableau. Faudrait que j'ajoute le mot "réaffectation" pour être plus précis

Citation:

Envoyé par Doksuri

Quel resultat sera affiché dans la console ?
=> au bout de 10, je repond en random....

:mouarf::ptdr::ptdr:

Merci pour ton retour, je vais corriger tout ça dès que possible

Cordialement Jérôme