This project is a complete web-based quiz system<\/strong> where users can take quizzes, check scores, and get results instantly. \u2714 Flask Web Framework This project is a complete web-based quiz system where users can take quizzes, check scores, and get results instantly.You\u2019ll build backend + frontend + database using Python. \ud83c\udfaf What You Will Learn \u2714 Flask Web Framework\u2714 HTML\/CSS + Bootstrap\u2714 Storing questions in JSON or SQLite\u2714 Timer-based quiz\u2714 Randomization of questions\u2714 Auto-grading system\u2714 Score history tracking\u2714 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-266","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/posts\/266","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=266"}],"version-history":[{"count":1,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/posts\/266\/revisions"}],"predecessor-version":[{"id":267,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=\/wp\/v2\/posts\/266\/revisions\/267"}],"wp:attachment":[{"href":"https:\/\/codetypingpro.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=266"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=266"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codetypingpro.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=266"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
You\u2019ll build backend + frontend + database<\/strong> using Python.<\/p>\n\n\n\n
\n\n\n\n\ud83c\udfaf What You Will Learn<\/strong><\/h1>\n\n\n\n
\u2714 HTML\/CSS + Bootstrap
\u2714 Storing questions in JSON or SQLite
\u2714 Timer-based quiz
\u2714 Randomization of questions
\u2714 Auto-grading system
\u2714 Score history tracking
\u2714 Admin panel (optional)<\/p>\n\n\n\n
\n\n\n\n\ud83d\udcc1 Project Folder Structure<\/strong><\/h1>\n\n\n\n
online_quiz\/\n\u2502\u2500\u2500 app.py\n\u2502\u2500\u2500 questions.json\n\u2502\u2500\u2500 templates\/\n\u2502 \u251c\u2500\u2500 home.html\n\u2502 \u251c\u2500\u2500 quiz.html\n\u2502 \u251c\u2500\u2500 result.html\n\u2502\u2500\u2500 static\/\n \u251c\u2500\u2500 style.css\n<\/code><\/pre>\n\n\n\n
\n\n\n\n\ud83e\udde9 1. Sample Questions File (questions.json)<\/strong><\/h1>\n\n\n\n
[\n {\n \"question\": \"What is the capital of France?\",\n \"options\": [\"London\", \"Paris\", \"Rome\", \"Berlin\"],\n \"answer\": \"Paris\"\n },\n {\n \"question\": \"Which language is used for AI?\",\n \"options\": [\"Python\", \"HTML\", \"CSS\", \"JavaScript\"],\n \"answer\": \"Python\"\n },\n {\n \"question\": \"Select the odd one out:\",\n \"options\": [\"Dog\", \"Cat\", \"Apple\", \"Lion\"],\n \"answer\": \"Apple\"\n }\n]\n<\/code><\/pre>\n\n\n\n
\n\n\n\n\ud83e\udde9 2. Flask Backend (app.py)<\/strong><\/h1>\n\n\n\n
from flask import Flask, render_template, request\nimport json, random\n\napp = Flask(__name__)\n\ndef load_questions():\n with open(\"questions.json\", \"r\") as f:\n return json.load(f)\n\n@app.route(\"\/\")\ndef home():\n return render_template(\"home.html\")\n\n@app.route(\"\/quiz\")\ndef quiz():\n questions = load_questions()\n random.shuffle(questions)\n return render_template(\"quiz.html\", questions=questions)\n\n@app.route(\"\/result\", methods=[\"POST\"])\ndef result():\n questions = load_questions()\n score = 0\n total = len(questions)\n\n for i, q in enumerate(questions):\n user_ans = request.form.get(f\"q{i}\")\n if user_ans == q[\"answer\"]:\n score += 1\n\n return render_template(\"result.html\", score=score, total=total)\n\nif __name__ == \"__main__\":\n app.run(debug=True)\n<\/code><\/pre>\n\n\n\n
\n\n\n\n\ud83c\udfa8 3. HTML Templates<\/strong><\/h1>\n\n\n\n
home.html<\/strong><\/h2>\n\n\n\n
<!DOCTYPE html>\n<html>\n<head>\n <title>Online Quiz<\/title>\n<\/head>\n<body>\n <h1>Welcome to Online Quiz Platform<\/h1>\n <a href=\"\/quiz\">Start Quiz<\/a>\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n
\n\n\n\nquiz.html<\/strong><\/h2>\n\n\n\n
<!DOCTYPE html>\n<html>\n<head>\n <title>Take Quiz<\/title>\n<\/head>\n<body>\n <h2>Answer the following questions:<\/h2>\n\n <form action=\"\/result\" method=\"post\">\n {% for q in questions %}\n <p><b>{{ loop.index }}. {{ q.question }}<\/b><\/p>\n\n {% for opt in q.options %}\n <input type=\"radio\" name=\"q{{ loop.index0 }}\" value=\"{{ opt }}\" required>\n {{ opt }} <br>\n {% endfor %}\n <br>\n {% endfor %}\n\n <button type=\"submit\">Submit<\/button>\n <\/form>\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n
\n\n\n\nresult.html<\/strong><\/h2>\n\n\n\n
<!DOCTYPE html>\n<html>\n<head>\n <title>Quiz Result<\/title>\n<\/head>\n<body>\n <h1>Your Score: {{ score }}\/{{ total }}<\/h1>\n\n {% if score == total %}\n <h2>Excellent! \ud83c\udf89<\/h2>\n {% elif score > total\/2 %}\n <h2>Good Job \ud83d\udc4d<\/h2>\n {% else %}\n <h2>Keep Practicing \ud83d\udcaa<\/h2>\n {% endif %}\n\n <a href=\"\/\">Go Home<\/a>\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n\n
\n\n\n\n\ud83d\ude80 How to Run the Project<\/strong><\/h1>\n\n\n\n
\n
pip install flask\n<\/code><\/pre>\n\n\n\n\n
online_quiz<\/code> folder.<\/li>\n\n\n\npython app.py\n<\/code><\/pre>\n\n\n\n\n
http://127.0.0.1:5000\/<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"