Quiz interface using Vue.js for Collaborative classroom project

:star: Development in progress

This single page application(SPA) quiz interface is designed to fetch a set of MCQs from the server Collaborative classroom API and run the quiz with a countdown timer.

This application makes use of vue.js and vuex for state management. Bootstrap is used for styling.

As of now, it is not hooked with collaborative classroom APIs. It fetches a set of 20 random but interesting questions from Trivia API. There is no authentication as of now, anybody can download and enjoy the quiz with variety of interesting questions.

Salient features

:point_right: Countdown timer
:point_right: Question navigation panel
:point_right: Visual representation for answered, unanswered and untouched questions
:point_right: Auto saves user responses

Here is a snapshot of the UI

Project setup

System requirements:

• Node & npm

After cloning the repo, run the following :point_down:

Install all the dependencies

npm install

Compiles and hot-reloads for development

npm run serve

Available routes

• localhost:8080/ : Base route for the app. This also contains the homepage.

• localhost:8080/quiz : Actual quiz page with countdown timer.

• localhost:8080/feedback : Automatic navigation to this page upon completion of the quiz.

Development in progress, all features may not be functioning right now.

Feel free to crack open an issue though, or drop general feedback.