Repository navigation
Quiz implementation #272
Description
Sometimes, a quiz is needed, rather than a code task.
That is: a question + a list of options with "choose one" / "choose many".
When a visitor selects the correct answer, then show ✅ ; otherwise ❌ with the feedback text explaining why it's wrong.
How should I implement it?
Astro component, perhaps?
I'd like to try, please sketch out a correct way ;)
Activity
AriPerkkio commentedon Aug 28, 2024
Lessons without coding tasks can hide the file tree and editor by specifying
editor: falsein frontmatter: https://tutorialkit.dev/reference/configuration/#editor.To build a list of options with logic for showing correct answer and description for incorrect answers, you could create a Vite application in the template for this.
iliakan commentedon Sep 1, 2024
Yes, I do need the logic for showing the answer/description.
"Vite application" - any docs or a similar example in the tutorial?
P.S. I've never built Vite apps, but surely can google up and read. So the question is mainly about how to integrate this into tutorialkit without patching.
AriPerkkio commentedon Sep 2, 2024
Where would you like to show the feedback for correct and incorrect answers? If in the preview tab is enough, you could have something like https://stackblitz.com/~/edit/vitejs-vite-zwwnxg?file=src%2Ftemplates%2Fdefault%2Findex.html&terminal=dev.
It's running the quiz application in preview and hiding the code editor. The quiz application itself doesn't have to be built with Vite - any web application works.