QuizDen

Introduction

A simple and minimalist quiz building and participating application. After building quiz, a quiz code will be generated for sharing. User can participate in the quiz with this code.

Technologies Used

Back-end System

• ExpressJS (NodeJS web framework)
• Mongoose (MongoDB ODM)

Front-end System

• ReactJS (Front-end Library)
• HTML
• CSS
• Bootstrap

Other NPM Dependencies

• BCrypt (Password hashing)
• JSON Web Token - JWT (Authentication token)
• Axios (HTTP client)

Database System

• MongoDB (NoSQL database, Mongoose ODM used for queries)

UI Elements

• The Logo is an Icon from IconScout
• The Emojis are from Emojipedia, Getemoji etc.
• Everything else is custom made

Screenshots

Landing Page

A minimal landing page

Dashboard

List of quizzes created by the user is listed here with sharable codes. User can both build and attend quizzes. Can see statistics of him/herself and for every quizzes curated by him/her.

Quiz Builder

User can add questions and for every question, indefinite number of options can be added. One of the option has to be selected as correct answer.

Quiz Code

User will see this page after creating a quiz successfully.

Find Quiz

User can paste quiz code to find quiz. The quiz title and description will be shown if found.

Quiz Taker

User can take the quiz after finding it using the code. Similar to the building interface, but nothing can be edited here. User can only select the options.

Quiz Result

User will see this page after taking a quiz successfully. The attendance count will increase by one. And the flawless count will be increased by one if they answer all correctly.