loading...

Add Quizzes 📃 to your Static Site using this Open Source Web Component 😁😁

sharadcodes profile image Sharad Raj ・1 min read

Hi Guys! 🤓

I've created a Web Component for Quiz using Vanilla JS.
I've made it open source for the community.

Also the implementation is dead simple, just like other web components.

So here is how it looks:

Snap

LIVE DEMO

https://sharadcodes.github.io/quizzo_web_component/example/

How to use ????

Questions are stored in json file that has following format

[
    {
        "que": "Which among the following is not an operating system ?",
        "opt": [
            "Ububtu",
            "MacOS",
            "Windows",
            "Android"
        ],
        "ans": 3
    },
    {
        "que": "Is Windows good",
        "opt": [
            "Yes",
            "No"
        ],
        "ans": 2
    }
]    

For more info visit the Repo at https://github.com/sharadcodes/quizzo_web_component

Just paste the following script in the head or just before the end of the body tag

<script src="https://sharadcodes.github.io/quizzo_web_component/src/quizzo_web_component.js" async></script>

Now inside the body paste this

  <!-- add the tag with all attributes -->
    <quizzo-web-comp
      json-file="./ques.json" 
      name="This is a demo quiz"
    />

That's it 🤩 .... And you are good to go !!!!!!


ALL LINKS ARE HERE:

Repo: https://github.com/sharadcodes/quizzo_web_component
Live Demo: https://sharadcodes.github.io/quizzo_web_component/example/

Posted on May 28 by:

sharadcodes profile

Sharad Raj

@sharadcodes

Full Stack Developer | Intel AI Edge Scholar 2019 | Google India Scholar 2018

Discussion

markdown guide
 

Your quiz is wrong. Linux is a kernel, not a full OS. Windows, however is.

Though I 100% agree that Linux is better than windows.

 

😂 I know it's a kernel forgot for a while