How To Create A Quiz Web Application With Python Django - DataFl
How To Create A Quiz Web Application With Python Django - DataFl
Python Projects +
Data Science
Python Django Projects
Data Science Tutorials
+
Machine Learning Pro… + Categories
Machine Learning Tutorials
Programming
Deep Learning Projects +
C Tutorials
How to Create a Quiz Web Free Courses
AICloud
Big Data +
Application with Python
Projects
Big Data
Scala
Cloud Tutorials
Computing
TutorialsTutorials
Python
PythonInterview
Android Tutorials
TutorialsQue… +
Hadoop
Python
Java
AWS
PythonTutorials
Tutorials
Tutorials
Ecosystem Tutorials
Quiz
BI TutorialsTutorials
Blockchain
+ Django
ApacheTutorials
TensorFlow
Tableau
Spring Spark
Tutorials
Tutorials
Tutorials
Linux
SQL & Tutorials
NoSQL Free Python course with 35 real-time projects Start
Apache
Pandas
Power
SQL Tutorials
BI
Tutorials
Flink
Tutorials
Tutorials Now!!
JavaScript
IoT Tutorials
Tutorials
Apache Tutorials
Django
QlikView
Cassandra
Kafka
Tutorials
Tutorials
Tutorials Quiz – best way to check our knowledge on a particular
AngularJS
R TutorialsTutorials topic.
Qlik SenseTutorials
MongoDB Tutorials
SAS Tutorials We have visited a lot of quiz platforms lately, right! Ever
SAP HANA Tutorials wondered if you could develop one.
AI Tutorials
In this article, we will guide you to develop a quiz
application using Python Django. Let’s see what all
functionalities we will be developing in this project (for
two roles – user and admin):
User:
Sign up (register)
Login
Quiz page (with timer)
Python Projects + Result page (with score, time taken, percentage score,
Python Django Projects + total questions, correct answers, wrong answers)
Machine Learning Pro… +
Admin:
Deep Learning Projects +
Login
AI Projects + Sign up
Python Interview Que… + Add Question
Quiz Page
Python Quiz +
Result Page
Project Prerequisites
You should have a basic knowledge of the following
technologies:
To install Django:
2. Writing Models
Code:
1. Py manage.py makemigrations
2. Py manage.py migrate
3. forms.py
Code:
4. admin.py
Code:
1. STATIC_URL = '/static/'
2. STATICFILES_DIRS=[BASE_DIR/'static']
6. urls.py
In this file we are just defining urls. To define urls:
Code:
7. views.py :
Code:
Add Question:
This method is only for admin, if any user tries to access
this method, the user is redirected to the home page. We
are basically using the add question form in this to create a
form object.
To validate the information entered by the user we are
using is_valid method and after validating the information
we are adding another question in the database using
Python Projects + save() method.
Python Django Projects +
Machine Learning Pro… +
Result.html
Deep Learning Projects + 1.
2.
{% extends 'Quiz/dependencies.html' %}
3. {% block content %}
AI Projects + 4.
5. <div class="container ">
Python Interview Que… + 6.
7. <div class="card-columns" style="padding: 10px;
Python Quiz + margin: 20px;">
8. <div class="card" align="centre "
style="width: 32rem; border:5px black solid">
9. <img class="card-img-top"
src="http://kmit.in/emagazine/wp-
content/uploads/2018/02/karnataka-results.jpg"
alt="Card image cap">
10. <div class="card-body">
11. <h5 class="card-title">Score:
{{score}}</h5>
12.
13. <p class="card-text">Percentage:
{{percent}}%</p>
14. <p class="card-text">Time Taken:
{{time}} seconds</p>
15. <p class="card-text">Correct
answers: {{correct}}</p>
16. <p class="card-text">Incorrect
answers: {{wrong}}</p>
17. <p class="card-text">Total
questions: {{total}}</p>
18. <h5>All the best for next quiz!
</h5>
19. </div>
20. </div>
21. </div>
22.
23. </div>
24.
25. {% endblock %}
Home.html
1. {% extends 'Quiz/dependencies.html' %}
2.
3. {% block content %}
4. {% load static %}
5. <div class="container ">
6. <h1>Welcome to DataFlair Quiz</h1>
7.
8. <div align="right " id="displaytimer"><b>Timer: 0
seconds</b></div>
Python Projects + 9.
10. <form method='post' action=''>
Python Django Projects + 11. {% csrf_token %}
12. {% for q in questions%}
Machine Learning Pro… + 13. <div class="form-group">
14. <label for="question">{{q.question}}</label>
Deep Learning Projects + 15. </div>
16. <div class="form-check">
AI Projects + 17. <div class="form-check">
18. <input class="form-check-input"
Python Interview Que… + type="radio" name="{{q.question}}" id="gridRadios1"
value="option1" checked>
19. <label class="form-check-label"
Python Quiz + for="gridRadios1">
20. {{q.op1}}
21. </label>
22. </div>
23. <div class="form-check">
24. <input class="form-check-input"
type="radio" name="{{q.question}}" id="gridRadios2"
value="option2">
25. <label class="form-check-label"
for="gridRadios2">
26. {{q.op2}}
27. </label>
28. </div>
29. <div class="form-check">
30. <input class="form-check-input"
type="radio" name="{{q.question}}" id="gridRadios1"
value="option3">
31. <label class="form-check-label"
for="gridRadios1">
32. {{q.op3}}
33. </label>
34. </div>
35. <div class="form-check">
36. <input class="form-check-input"
type="radio" name="{{q.question}}" id="gridRadios2"
value="option4">
37. <label class="form-check-label"
for="gridRadios2">
38. {{q.op4}}
39. </label>
40. </div>
Python Projects + 41. <br>
42. </div>
Python Django Projects + 43. {% endfor %}
44. <input id='timer' type='hidden' name="timer"
Machine Learning Pro… + value="">
45. <br>
Deep Learning Projects + 46. <button type="submit" class="btn btn-
primary">Submit</button>
AI Projects + 47.
48.
</form>
{% block script %}
49. <script>
Python Interview Que… + 50.
51. console.log('hello world')
Python Quiz + 52. const
timer=document.getElementById('displaytimer')
53. console.log(timer.textContent)
54. const inputtag =
document.getElementById('timer')
55.
56. t=0
57. setInterval(()=>{
58. t+=1
59. timer.innerHTML ="<b>Timer: " +t+"
seconds</b>"
60. inputtag.value = t
61. },1000)
62. </script>
63. {% endblock script %}
64.
65. </div>
66. {% endblock %}
Quiz page
Python Projects +
Python Django Projects +
Machine Learning Pro… +
AddQuestion.html
1. {% extends 'Quiz/dependencies.html' %}
2.
3. {% block content %}
4.
5. <div class="jumbotron container row">
6. <div class="col-md-6">
7. <h1>Add Question</h1>
8. <div class="card card-body">
9. <form action="" method="POST">
10. {% csrf_token %}
11. {{form.as_p}}
12. <br>
13. <input type="submit" name="Submit">
14. </form>
15. </div>
16. </div>
17. </div>
Python Projects + 18.
19. </div>
Python Django Projects + 20.
21. {% endblock %}
Machine Learning Pro… +
AI Projects +
Python Interview Que… +
Python Quiz +
dependencies.html
1. {% load static %}
2. <html>
3. <head>
4. <title>
5. DataFlair Online Quiz with Django
6. </title>
7. <link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.
integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+N
crossorigin="anonymous">
8. </head>
9. <body>
10. {% include 'Quiz/navbar.html' %}
11. {% block content %}
12. {% endblock %}
Python Projects + 13. <br>
14.
Python Django Projects + 15. <script src="https://code.jquery.com/jquery-
integrity="sha384-
Machine Learning Pro… + DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUe
crossorigin="anonymous"></script>
Deep Learning Projects + 16. <script
src="https://cdn.jsdelivr.net/npm/[email protected]/di
AI Projects + integrity="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQ
crossorigin="anonymous"></script>
Python Interview Que… + 17. <script
src="https://stackpath.bootstrapcdn.com/bootstrap/4.5
Python Quiz + integrity="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75
crossorigin="anonymous"></script>
18. </body>
19. </html>
Login.html
1. {% extends 'Quiz/dependencies.html' %}
2. {% load static%}
3. {% block content %}
4. <div class="container jumbotron">
5. <form method="POST" action="">
6. {% csrf_token %}
7. <p><input type="text" name="username"
placeholder="Username..."></p>
8. <p><input type="password" name="password"
placeholder="Password..." ></p>
9. <input class="btn btn-success"
type="submit" value="Login">
10. <p>Do not have an account<a href='{% url
'register' %}'>Register</a></p>
11. </form>
12. </div>
13. {% endblock %}
Register.html
Python Projects + 1. {% extends 'Quiz/dependencies.html' %}
2. {% load static %}
Python Django Projects + 3. {% block content %}
4. <div class="container jumbotron">
<form method="POST" action="" >
Machine Learning Pro… + 5.
6. {% csrf_token %}
7. {{form.as_p}}
Deep Learning Projects + 8.
9. <input class="btn btn-success"
AI Projects + type="submit" value="Register Account">
10. </form>
Python Interview Que… + 11. </div>
12. {% endblock %}
Python Quiz +
Summary
We have developed an Online Quiz application Project
using Python Django. We developed quiz web application
with following functionalities: Login, Sign up, Add
Question, Quiz Page, Result Page. You can develop more
interesting projects with Django, so keep exploring and
keep learning.
Tags: create python quiz django quiz app online django quiz
17 RESPONSES
Comments 17 Pingbacks 0
Python Projects +
Karthika C July 4, 2021 at 11:07 pm
Python Django Projects + What is username and password
Machine Learning Pro… + Reply
if q.ans == request.POST.get(q.question):
…….
Hey Ferdinand,
Python Projects + This is what I did. I downloaded the zip file, unzip the file (I
Python Django Projects + moved the zip file on Documents and extract it there). Then I
went to the directory where manage.py is located via terminal,
Machine Learning Pro… +
and ran “python manage.py runserver”.
Reply
VINAY KARNA October 23, 2022 at 5:00 pm
total+=1
answer = request.POST.get(q.question) # Gets user’s choice, i.e
the key of answer
items = vars(q) # Holds the value for choice
print(items[answer])
# Compares actual answer with user’s choice
if q.ans == items[answer]:
score+=10
correct+=1
else:
wrong+=1
percent = score/(total*10) *100
context = {
‘score’:score,
‘time’: request.POST.get(‘timer’),
Python Projects + ‘correct’:correct,
‘wrong’:wrong,
Python Django Projects + ‘percent’:percent,
Machine Learning Pro… + ‘total’:total
}
Deep Learning Projects + return render(request,’mcqapp/result.html’,context)
AI Projects + else:
questions=QuesModel.objects.all()
Python Interview Que… + context = {
Python Quiz + ‘questions’:questions
}
return render(request,’mcqapp/home.html’,context)
Reply
def home(request):
if request.method == ‘POST’:
questions=QuesModel.objects.all()
score=0
wrong=0
correct=0
total=0
for q in questions:
total+=1
answer = request.POST.get(q.question) # Gets user’s choice, i.e
the key of answer
items = vars(q) # Holds the value for choice
print(items[answer])
# Compares actual answer with user’s choice
if q.ans == items[answer]:
score+=10
Python Projects + correct+=1
else:
Python Django Projects + wrong+=1
Machine Learning Pro… + percent = score/(total*10) *100
context = {
Deep Learning Projects + ‘score’:score,
AI Projects + ‘time’: request.POST.get(‘timer’),
‘correct’:correct,
Python Interview Que… + ‘wrong’:wrong,
Python Quiz + ‘percent’:percent,
‘total’:total
}
return render(request,’mcqapp/result.html’,context)
else:
questions=QuesModel.objects.all()
context = {
‘questions’:questions
}
return render(request,’mcqapp/home.html’,context)
Reply
Reply
Post Comment
Home About us Contact us Terms and Conditions Privacy Policy Disclaimer Write For Us Success Stories
DataFlair © 2023. All Rights Reserved.