📚 Reading Challenge

An interactive learning experience that tests reading comprehension using AI-generated stories and quizzes.

• Topic Selection: Choose from 10 default topics or enter your own custom topic
• AI-Generated Stories: Creates engaging 4-paragraph stories at middle school reading level
• Interactive Quiz: 3 multiple-choice questions per story to test comprehension
• Instant Feedback: Results page shows score with correct answers highlighted in green and wrong answers in red
• Flexible Options: Retake the same quiz or generate a new story on a different topic

1. Choose a Topic: Select from pre-made topics like "Space Exploration 🚀" or "Dinosaurs 🦕", or enter your own
2. Read the Story: AI generates a custom 4-paragraph story appropriate for middle school students
3. Take the Quiz: Answer 3 multiple-choice questions about the story
4. View Results: See your score out of 3, with detailed feedback on each question
5. Try Again: Retake the quiz or start fresh with a new topic

• Backend: Hono (lightweight web framework)
• Frontend: React 18.2.0 with TypeScript
• AI: OpenAI API (via Val Town standard library)
• Styling: Tailwind CSS (via Twind CDN)
• Platform: Val Town

├── server.tsx              # Main Hono server entry point
├── frontend/
│   ├── index.html         # HTML template
│   ├── index.tsx          # React app entry point
│   ├── style.css          # Custom CSS styles
│   └── components/
│       └── App.tsx        # Main React component with all views
└── shared/
    └── types.ts           # TypeScript interfaces

Generates a story based on a topic.

Request:

{
  "topic": "Space Exploration"
}

Response:

{
  "topic": "Space Exploration",
  "content": "Four paragraph story..."
}

Generates quiz questions based on a story.

Request:

{
  "story": "Story content..."
}

Response:

{
  "questions": [
    {
      "question": "What is the main theme?",
      "options": ["A", "B", "C", "D"],
      "correctAnswer": 0
    }
  ]
}

This app runs on Val Town and uses the Val Town OpenAI standard library, so no API key configuration is needed. Simply deploy the files to your Val Town project and the app is ready to use.

• Space Exploration 🚀
• Ancient Egypt 🏛️
• Underwater Life 🐠
• Dinosaurs 🦕
• Pirates 🏴‍☠️
• Robots and AI 🤖
• Medieval Knights ⚔️
• Rainforest Adventures 🌴
• The Wild West 🤠
• Mysteries of the Ocean 🌊