/Quizard

A React based online quiz application built during the JAMstack Hackathon 2018!

Primary LanguageJavaScriptMIT LicenseMIT

Introduction

Are you cursed with knowledge in general?... well then consider becoming a Quiz Wizard!

A React based application implemented using the JAMstack principles where one passing the quiz shall win the title of Quizard!

Project Idea

An online quiz app where questions would be asked on topics selected by the user. This is a timer-based quiz with four options for every question with only one being correct. Now, after successfully completing the quiz, the user will be mailed with a digital badge and the score reflecting his/her performance!

Table of Contents

Tools

Since this is a JAMstack application there won't be any server-side programming involved. Most of the backend work are going to be abstracted away with:

Now, frontend (as mentioned above) is to implemented with:

Color Pallete

The color palette are inspired from the logo itself and the entire application must reflect these set of colors:

  • #555273
  • #78758f
  • #a4b0c3
  • #8594af
  • #65799b
  • #83859e
  • #ffffff
  • #000000

Installation

This project was bootstrapped with Create React App.

In the project directory, you can run:

npm install

This will install all the relevant packages required for the project!

npm start

Runs the app in the development mode. Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits. You will also see any lint errors in the console.

npm test

Launches the test runner in the interactive watch mode. See the section about running tests for more information.

npm run build

Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes. Your app is ready to be deployed!

See the section about deployment for more information.

NOTE: Don't use it since we'll only be developing the project! Netlify will automatically build it for us.

npm run eject

NOTE: This is a one-way operation. Once you eject, you can’t go back! So, never use this one!

Learn More

You can learn more in the Create React App documentation. To learn React, check out the React documentation.

Contribution

For contribution details check CONTRIBUTING.md 🎉

This project is part of JAMstack Hackathon 2018 & guidelines for participation are listed here.

License

The MIT License 2018 - Priyabrata Biswas.