BubbleCheck's Old Tech Stack
In 2013 I built BubbleCheck, an automated grading tool that lets teachers design multiple choice exams, scan in their students' completed exams, and review the results.
Now, over a decade later, 308 teachers have used BubbleCheck to automatically grade a whopping of 48,000 exams. Assuming each exam would have taken, say, 5 minutes to grade by hand, it's saved teachers a collective 4000 hours of grading.
At this point, I an confidently say that the project was worth it. Relevant XKCD.
But, technology changes and BubbleCheck is built on a tech stack that is considered "ancient" at this point.
So, it's time to rebuild BubbleCheck with modern tools.
BubbleCheck's old tech stack
In 2013 I reached for technologies that I was comfortable with - what people affectionately call a LAMP stack (Linux, Apache, MySQL, PHP). I had built some web apps on top of the LAMP stack for my college's student government website, Oleville, so the learning curve wasn't high.
I used the (latest and greatest at the time) version 5.x of PHP. I knew that I didn't want to build an entire ORM layer myself, so I reached for Laravel, which I found very pleasant to work with.
Teachers generally scan students' exams to PDF files. The processing of their PDFs is done in C++ using MuPDF to convert PDF scans to individual PNG images, and OpenCV is leveraged to process the images. Uploaded PDFs are processed by a cron job that kicks off every minute.
The frontend is rendered server-side with Laravel and leverages the Bootstrap CSS framework for UI elements. The frontend communicates with the backend using jQuery.
The web services does not scale.
From 2013 until 2017 I hosted BubbleCheck on a shared Bluehost PHP node, backed by a hosted MySQL.
Now, it's installed on a single t2.micro EC2 in AWS that runs PHP, MySQL, and has a mounted EFS filesystem for storing scanned exams.
| Component | Technology |
|---|---|
| Backend Language | PHP 5.x |
| Backend ORM | Laravel 4.2.x |
| Web Server | Apache |
| Backend Compute | Ubuntu Linux |
| Database | MySQL 5.7 |
| Frontend UI | Raw HTML and CSS (with Bootstrap) |
| Frontend API Client | jQuery |
| Frontend Hosting | Server-side rendering from Laravel |
| CI/CD Deployment | Manual rsync of new files |
| Infrastructure Management | Manual |
| Image Processing | C++ with OpenCV |
Obviously this tech stack is old. Most components of my tech stack have been EOL'd for years. It's time to revamp things.
In the upcoming blog posts, I'll write about my journey as I rebuild BubbleCheck using modern technologies, to make a maintainable, scalable web and mobile app, and I'll share my learnings along the way.