Online Quiz and Exam Platform

Requirements

  • Python 3.x
  • Flask
  • SQLite (for a simple database)
  • HTML/CSS/JavaScript (for the frontend)

Step 1: Setting Up Your Environment

First, ensure you have Flask installed. You can do this using pip:

pip install Flask

Step 2: Create the Flask App

Create a directory for your project and inside it, create a file named app.py.

# app.py
from flask import Flask, render_template, request, redirect, url_for, session
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SECRET_KEY'] = 'your_secret_key'
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///quizzes.db'
db = SQLAlchemy(app)

# Models
class Quiz(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(100), nullable=False)

class Question(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    quiz_id = db.Column(db.Integer, db.ForeignKey('quiz.id'), nullable=False)
    question_text = db.Column(db.String(200), nullable=False)
    options = db.Column(db.String(500), nullable=False)
    answer = db.Column(db.String(200), nullable=False)

# Routes
@app.route('/')
def index():
    quizzes = Quiz.query.all()
    return render_template('index.html', quizzes=quizzes)

@app.route('/quiz/<int:quiz_id>', methods=['GET', 'POST'])
def quiz(quiz_id):
    if request.method == 'POST':
        # Handle quiz submission
        return redirect(url_for('results'))

    quiz = Quiz.query.get_or_404(quiz_id)
    questions = Question.query.filter_by(quiz_id=quiz_id).all()
    return render_template('quiz.html', quiz=quiz, questions=questions)

@app.route('/results')
def results():
    return "Results page"

if __name__ == '__main__':
    db.create_all()
    app.run(debug=True)

Step 3: Create HTML Templates

Create a folder named templates in the same directory as your app.py. Inside this folder, create two HTML files: index.html and quiz.html.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Quizzes</title>
</head>
<body>
    <h1>Available Quizzes</h1>
    <ul>
        {% for quiz in quizzes %}
        <li><a href="{{ url_for('quiz', quiz_id=quiz.id) }}">{{ quiz.title }}</a></li>
        {% endfor %}
    </ul>
</body>
</html>

quiz.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ quiz.title }}</title>
</head>
<body>
    <h1>{{ quiz.title }}</h1>
    <form method="POST">
        {% for question in questions %}
        <div>
            <p>{{ question.question_text }}</p>
            {% for option in question.options.split(',') %}
            <label>
                <input type="radio" name="question_{{ question.id }}" value="{{ option }}">
                {{ option }}
            </label><br>
            {% endfor %}
        </div>
        {% endfor %}
        <button type="submit">Submit</button>
    </form>
</body>
</html>

Step 4: Populate the Database

You can use a Python shell or create a separate script to add quizzes and questions to your database. For example:

from app import db, Quiz, Question

# Create quizzes and questions
db.create_all()

quiz1 = Quiz(title='Python Basics')
db.session.add(quiz1)
db.session.commit()

question1 = Question(quiz_id=1, question_text='What is the output of 2 + 2?', options='3,4,5,6', answer='4')
db.session.add(question1)
db.session.commit()

Step 5: Run Your Application

Now you can run your Flask application:

python app.py

Step 6: Access the App

Open your browser and navigate to http://127.0.0.1:5000/. You should see your quiz index page.

Future Enhancements

  • User authentication (login/signup)
  • Score tracking
  • Timer for quizzes
  • Admin interface for quiz management
  • Frontend improvements with frameworks like React or Vue.js

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *