XUNBAO 2020 is a Quiz WebApp made during Online Culmyca 2020 held at JC Bose University of Science and Technology, developed by members of Manan - A techno Surge. We got 300+ Participants and it was loved by all of them. Participants enthusiastically participated in this 3 Day event.
- ReactJs
- Django
- Facebook API
- ReactJs
- Python
- Django
-
Frontend
npm i node-modules npm start
-
Backend
pip install -r requirements.txt python manage.py makemigrations python manage.py migrate
-
To Create Super User
python3 manage.py createsuperuser
-
To Run Server
python3 manage.py runserver
-
React is an open-source, front end, JavaScript library for building user interfaces or UI components. It is maintained by Facebook and a community of individual developers and companies. React can be used as a base in the development of single-page or mobile applications.
-
- Component-Based
- Declarative
- Incredibly versatile
- Learn Once, Write Anywhere
-
-
React-Bootstrap replaces the Bootstrap JavaScript. Each component has been built from scratch as a true React component, without unneeded dependencies like jQuery. As one of the oldest React libraries, React-Bootstrap has evolved and grown alongside React, making it an excellent choice as your UI foundation.
-
You should populate data with AJAX calls in the componentDidMount lifecycle method. This is so you can use setState to update your component when the data is retrieved.
-
The FrontEnd is made by the help of reactJs, AJAX for API calls and CSS. The structure is pretty simple with various components. The info about react tree will can be seen in router.js file.
-
Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design. Built by experienced developers, it takes care of much of the hassle of Web development, so you can focus on writing your app without needing to reinvent the wheel. It's free and open source.
-
- Ridiculously fast
- Reassuringly secure
- Exceedingly scalable
- Incredibly versatile
- Easy to Integrate with Python Libraries/Functions
-
-
JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA.
Although JWTs can be encrypted to also provide secrecy between parties, we will focus on signed tokens. Signed tokens can verify the integrity of the claims contained within it, while encrypted tokens hide those claims from other parties. When tokens are signed using public/private key pairs, the signature also certifies that only the party holding the private key is the one that signed it. When should you use JSON Web Tokens?
-
-
Authorization: This is the most common scenario for using JWT. Once the user is logged in, each subsequent request will include the JWT, allowing the user to access routes, services, and resources that are permitted with that token. Single Sign On is a feature that widely uses JWT nowadays, because of its small overhead and its ability to be easily used across different domains.
-
Information Exchange: JSON Web Tokens are a good way of securely transmitting information between parties. Because JWTs can be signed—for example, using public/private key pairs—you can be sure the senders are who they say they are. Additionally, as the signature is calculated using the header and the payload, you can also verify that the content hasn't been tampered with.
-
-
-
For Xunbao we created 6 models/tables.
- User Profile
- Question
- Hint
- Answer
- Submission
- Happy Hour
So before explaining about models and their fields i would like to explain our goal/aim with which we started to make this quiz. We wanted to make Quiz as much interesting as much we can so we focused on 5 main points.
- Multiple answers for a question
- Full Score in Happy Hour
- Hint would be given but some score would be deducted when the participant answers that question
- Marking system should be relative to previous correct submissions.
- Participant can only move forward question by question.
- User Profile - Name, Pic, Score, Level, Submission_count, fid (fb id)
- Question - ques, hint, no (index)
- Hint - ques, user, hint, fid, hintviewed
- Answer - ques, answer
- Submission - user, fid, ques, answer, datetime, score, response, hintviewed
- Happy hour - start, end
Here we used Django Model Viewsets, Model serializer and Default Routers (to handle UI and links for APIs) for APIs and JWT fot token auth.
💻Sanyam Mittal |
💻Aayush Tyagi |
💻Arun |
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.