One of our team members is on the Maryland Academic Quiz Team. As most of the team is in Chicago this weekend for a tournament, we figured we'd keep the spirit of QuizBowl alive at UMD by making our Bitcamp project QuizBowl-themed.
What it does
Quibble lets you view questions we got from real collegiate level QuizBowl question sets line-by-line, clue-by-clue. Advance at your own pace, but try to get the answer before the question ends! You can check your answers by clicking "Show Answer" or get a new question altogether with "New Question".
How we built it
Quibble is built out of several connected systems.
The web interface
The visible Quibble app is written in Angular.JS and uses Bootstrap for styling. The front-end code covers display of the questions to the user and interactivity, but contains minimal business logic, as that has all been offloaded to the API layer. The web interface is managed by bower and npm.
The REST API
Quibble provides a REST API for accessing QuizBowl questions. Currently the server supports two endpoints, /questions/random and /clues/random, but the API server has been built with extensibility in mind as our needs grow. The API is built in Haskell using the Snap webserver framework, and uses PostgreSQL as a data store. Both the REST API and the packet parser are managed by haskell's stack, a haskell project management tool.
The packet parser
The QuizBowl Packets Archive provides access to past collegiate quizbowl question packets, but they're distributed in PDF or DOCX format. We wrote a utility in Haskell that uses the Pandoc library to parse these packets and extract the questions, clues, and answers from them, and then inserts that data into our database.
The whole Quibble stack runs on an AWS small instance with an Ubuntu image.
Challenges we ran into
The original plan called for the front-end to be served by node.js for convenience and the REST API to be served on a different port. However, the same-origin policy prevented the web interface from accessing the API. We solved this by modifying our API server to also serve our front-end as a static page so that they could both run on the same port.
Accomplishments that we're proud of
The design for Quibble is really solid. Adding features should be a breeze now that the groundwork is in place, as all we have to do is add a feature to our API and a small amount of front-end code to access it. Quibble is extensible by design.
What we learned
We came into Bitcamp with no knowledge of Snap, Angular, or Pandoc. Despite this, we built a functioning web application using all three of those technologies, and more! We've all gained experience in real-world technologies and got to have fun doing it.
What's next for Quibble
We have a lot of directions we can go from here. Next on our list will probably be adding a categorization system, so that users can select whether they want to see questions related to science, literature, history, or a host of other categories. We also want to add a flagging system for incorrectly parsed or otherwise broken questions and a web interface for uploading packets. Long-term, we hope that this app can help out the QuizBowl community. There is a serious lack of tools for learning quizbowl, and we hope Quibble can help fill that gap.